(fix): updated tests for wire component changes

src/app/modules/wire/creator/creator.component.spec.ts

@@ -31,6 +31,7 @@ import { sessionMock } from '../../../../tests/session-mock.spec';
 import { web3WalletServiceMock } from '../../../../tests/web3-wallet-service-mock.spec';
 import { IfFeatureDirective } from '../../../common/directives/if-feature.directive';
 import { FeaturesService } from '../../../services/features.service';
+import { MockComponent } from '../../../utils/mock';
 
 /* tslint:disable */
 @Component({
@@ -155,7 +156,7 @@ describe('WireCreatorComponent', () => {
  }
 
  function getAmountLabel(): DebugElement {
- return fixture.debugElement.query(By.css('span.m-wire--creator-wide-input--label'));
+ return fixture.debugElement.query(By.css('.m-wire--creator-wide-input--label'));
  }
 
  function getRecurringCheckbox(): DebugElement {
@@ -182,6 +183,14 @@ describe('WireCreatorComponent', () => {
  AddressExcerptPipe,
  TokenPipe,
  IfFeatureDirective,
+ MockComponent({
+ selector: 'm-wireCreator__rewards',
+ inputs: [ 'rewards', 'amount', 'currency', 'channel', 'sums' ],
+ outputs: [ 'selectReward' ],
+ }),
+ MockComponent({
+ selector: 'm-payments__selectCard',
+ }),
  ], // declare the test component
  imports: [FormsModule, RouterTestingModule],
  providers: [
@@ -278,12 +287,6 @@ describe('WireCreatorComponent', () => {
  jasmine.clock().uninstall();
  });
 
- it('should have a title', () => {
- const title = fixture.debugElement.query(By.css('.m-wire--creator--header span'));
- expect(title).not.toBeNull();
- expect(title.nativeElement.textContent).toContain('Wire');
- });
-
  it('should have the target user\'s avatar', () => {
  const avatar = fixture.debugElement.query(By.css('.m-wire--creator--header-text .m-wire--avatar'));
  expect(avatar).not.toBeNull();
@@ -301,7 +304,7 @@ describe('WireCreatorComponent', () => {
  const subtitle = fixture.debugElement.query(By.css('.m-wire--creator--header .m-wire-creator--subtext'));
  expect(subtitle).not.toBeNull();
 
- expect(subtitle.nativeElement.textContent).toContain('Support @' + comp.owner.username + ' by sending them tokens. Once you send them the amount listed in the tiers, you can receive rewards if they are offered. Otherwise, it\'s a donation.');
+ expect(subtitle.nativeElement.textContent).toContain('Support @' + comp.owner.username + ' by');
  });
 
  it('should have a payment section', () => {
@@ -315,18 +318,24 @@ describe('WireCreatorComponent', () => {
  expect(title.nativeElement.textContent).toContain('Payment Method');
  });
 
- it('should have payment method list (onchain, offchain)', () => {
+ it('should have payment method list (tokens, eth, usd, btc)', () => {
  const list = fixture.debugElement.query(By.css('section.m-wire--creator-payment-section > ul.m-wire--creator-selector'));
  expect(list).not.toBeNull();
 
- expect(list.nativeElement.children.length).toBe(3);
+ expect(list.nativeElement.children.length).toBe(4);
 
- expect(fixture.debugElement.query(By.css('.m-wire--creator-selector > li:first-child > .m-wire--creator-selector-type > h5 > span')).nativeElement.textContent).toContain('OnChain');
- expect(fixture.debugElement.query(By.css('.m-wire--creator-selector > li:nth-child(2) > .m-wire--creator-selector-type > h5 > span')).nativeElement.textContent).toContain('OffChain');
+ expect(fixture.debugElement.query(By.css('.m-wire--creator-selector > li:first-child > .m-wire--creator-selector-type > h5 > span')).nativeElement.textContent)
+ .toContain('Tokens');
+ expect(fixture.debugElement.query(By.css('.m-wire--creator-selector > li:nth-child(2) > .m-wire--creator-selector-type > h5 > span')).nativeElement.textContent)
+ .toContain('USD');
+ expect(fixture.debugElement.query(By.css('.m-wire--creator-selector > li:nth-child(3) > .m-wire--creator-selector-type > h5 > span')).nativeElement.textContent)
+ .toContain('ETH');
+ expect(fixture.debugElement.query(By.css('.m-wire--creator-selector > li:nth-child(4) > .m-wire--creator-selector-type > h5 > span')).nativeElement.textContent)
+ .toContain('BTC');
  });
 
  it('clicking on a payment option should highlight it', fakeAsync(() => {
- comp.setPayloadType('offchain'); // Select other
+ comp.setPayloadType('usd'); // Select other
 
  fixture.detectChanges();
  tick();
@@ -385,10 +394,10 @@ describe('WireCreatorComponent', () => {
  expect(balance).toBe('500');
  });
 
- it(`should have OffChain balance`, () => {
+ it(`should have token balance`, () => {
  fixture.detectChanges();
 
- const onchainOption = getPaymentMethodItem(2),
+ const onchainOption = getPaymentMethodItem(1),
  subtext = onchainOption.query(By.css('.m-wire--creator-selector-subtext')).nativeElement.textContent.trim(),
  balance = subtext.substr(subtext.lastIndexOf(' ')).trim();
 
@@ -404,10 +413,10 @@ describe('WireCreatorComponent', () => {
 
  it(`recurring checkbox should toggle wire's recurring property`, () => {
 
- comp.setPayloadType('onchain');
+ comp.setPayloadType('offchain');
  fixture.detectChanges();
 
- expect(comp.wire.recurring).toBe(false);
+ expect(comp.wire.recurring).toBe(true);
  const checkbox: DebugElement = getRecurringCheckbox();
 
  checkbox.nativeElement.click();
@@ -416,11 +425,11 @@ describe('WireCreatorComponent', () => {
  fixture.detectChanges();
 
  expect(checkbox).not.toBeNull();
- expect(comp.wire.recurring).toBe(true);
+ expect(comp.wire.recurring).toBe(false);
  });
 
- it('should show creator rewards', () => {
- expect(fixture.debugElement.query(By.css('m-wire--creator-rewards'))).not.toBeNull();
+ it('should show creator tiers', () => {
+ expect(fixture.debugElement.query(By.css('m-wireCreator__rewards'))).not.toBeNull();
  });
 
  it('should have a submit section', () => {
@@ -493,9 +502,15 @@ describe('WireCreatorComponent', () => {
  spyOn(comp, 'submit').and.callThrough();
  spyOn(comp, 'canSubmit').and.returnValue(true);
 
+ // Select tokens
  const selectTokens = getPaymentMethodItem(1);
  selectTokens.nativeElement.click();
+ fixture.detectChanges();
 
+ // Select onchain method
+ const select = fixture.debugElement.query(By.css('.m-wireCreator__tokenMethod .m-selector select')).nativeElement;
+ select.value = select.options[0].value;
+ select.dispatchEvent(new Event('change'));
  fixture.detectChanges();
 
  const amountInput: DebugElement = getAmountInput();
@@ -523,4 +538,52 @@ describe('WireCreatorComponent', () => {
  recurring: false
  });
  }));
+
+ it('should open usd payments when selected', fakeAsync(() => {
+ // Select usd
+ const selectTokens = getPaymentMethodItem(2);
+ selectTokens.nativeElement.click();
+ fixture.detectChanges();
+
+ expect(comp.wire.payloadType).toBe('usd');
+
+ const ccSelector = fixture.debugElement.query(By.css('m-payments__selectCard'));
+ expect(ccSelector).not.toBeNull();
+ }));
+
+ it('should update amount and method on tier/reward selection events', fakeAsync(() => {
+ // selectReward calls the function
+ comp.setTier({
+ amount: 5,
+ currency: 'tokens',
+ });
+ fixture.detectChanges();
+ tick();
+
+ // Amount input changes to 5 Tokens
+ const amountInput: DebugElement = getAmountInput();
+ expect(amountInput.nativeElement.value).toBe('5');
+
+ // Payment method changes to tokens
+ const tokenOptions = getPaymentMethodItem(1);
+ expect(tokenOptions.nativeElement.classList.contains('m-wire--creator-selector--highlight'))
+ .toBeTruthy();
+
+ // selectReward calls the function
+ comp.setTier({
+ amount: 15,
+ currency: 'usd',
+ });
+ fixture.detectChanges();
+ tick();
+
+ // Amount input changes to 15 USD
+ expect(amountInput.nativeElement.value).toBe('15');
+
+ // Payment method changes to tokens
+ const usdOptions = getPaymentMethodItem(2);
+ expect(usdOptions.nativeElement.classList.contains('m-wire--creator-selector--highlight'))
+ .toBeTruthy();
+ }));
+
 });

src/app/modules/wire/creator/creator.component.ts

@@ -508,7 +508,10 @@ export class WireCreatorComponent {
  }
  }
 
- let { done } = await this.wireService.submitWire(this.wire);
+ let { done } = await this.wireService.submitWire({
+ ...this.wire,
+ ...{ recurring: this.wire.recurring && this.canRecur }, // Override when we can't recur but don't change component boolean
+ });
 
  if (done) {
  this.success = true;

src/app/modules/wire/wire.service.spec.ts

@@ -4,6 +4,7 @@ import { wireContractServiceMock } from '../../../tests/wire-contract-service-mo
 import { tokenContractServiceMock } from '../../../tests/token-contract-service-mock.spec';
 import { web3WalletServiceMock } from '../../../tests/web3-wallet-service-mock.spec';
 import { fakeAsync, tick } from '@angular/core/testing';
+import { BTCService } from '../payments/btc/btc.service';
 
 describe('WireService', () => {
  let service: WireService;
@@ -11,7 +12,15 @@ describe('WireService', () => {
  beforeEach(() => {
  jasmine.clock().uninstall();
  jasmine.clock().install();
- service = new WireService(clientMock, wireContractServiceMock, tokenContractServiceMock, web3WalletServiceMock);
+ service = new WireService(
+ clientMock,
+ wireContractServiceMock,
+ tokenContractServiceMock,
+ web3WalletServiceMock,
+ new (() => {
+ 
+ })
+ );
 
  clientMock.response = {};
 
@@ -41,11 +50,11 @@ describe('WireService', () => {
  expect(web3WalletServiceMock.getCurrentWallet).toHaveBeenCalled();
 
  expect(clientMock.post).toHaveBeenCalled();
- expect(clientMock.post.calls.mostRecent().args[0]).toBe(`api/v1/wire/null`);
+ expect(clientMock.post.calls.mostRecent().args[0]).toBe(`api/v2/wire/null`);
  expect(clientMock.post.calls.mostRecent().args[1]).toEqual({
  amount: 10,
  payload: { receiver: '0x1234', address: '0x123', method: 'onchain', txHash: 'hash' },
- method: 'tokens',
+ method: 'onchain',
  recurring: false
  });
  }));
@@ -62,32 +71,32 @@ describe('WireService', () => {
  tick();
 
  expect(clientMock.post).toHaveBeenCalled();
- expect(clientMock.post.calls.mostRecent().args[0]).toBe(`api/v1/wire/null`);
+ expect(clientMock.post.calls.mostRecent().args[0]).toBe(`api/v2/wire/null`);
  expect(clientMock.post.calls.mostRecent().args[1]).toEqual({
  amount: 10,
  payload: { address: 'offchain', method: 'offchain' },
- method: 'tokens',
+ method: 'offchain',
  recurring: false
  });
  }));
 
- it('should submit a credit card wire', fakeAsync(() => {
+ it('should submit a usd wire', fakeAsync(() => {
  service.submitWire({
  amount: 10,
  guid: null,
  payload: { address: 'offchain', token: 'tok_KPte7942xySKBKyrBu11yEpf' },
- payloadType: "creditcard",
+ payloadType: "usd",
  recurring: false
  });
 
  tick();
 
  expect(clientMock.post).toHaveBeenCalled();
- expect(clientMock.post.calls.mostRecent().args[0]).toBe(`api/v1/wire/null`);
+ expect(clientMock.post.calls.mostRecent().args[0]).toBe(`api/v2/wire/null`);
  expect(clientMock.post.calls.mostRecent().args[1]).toEqual({
  amount: 10,
- payload: { address: 'offchain', token: 'tok_KPte7942xySKBKyrBu11yEpf', method: 'creditcard' },
- method: 'tokens',
+ payload: { address: 'offchain', token: 'tok_KPte7942xySKBKyrBu11yEpf', method: 'usd' },
+ method: 'usd',
  recurring: false
  });
  }));