使用 Jasmine 在 Angular 中测试异步函数的问题答案

【问题标题】：Problem with testing async functions in Angular with Jasmine使用 Jasmine 在 Angular 中测试异步函数的问题
【发布时间】：2020-08-12 11:05:20
【问题描述】：

我正在使用 Jasmine 对我的 Ionic 4 应用程序进行单元测试。目前，我在运行几乎所有测试时都遇到了错误，因为我在 async/await 函数上做错了。我得到的错误是：“错误：超时 - 异步功能未在 5000 毫秒内完成。”我已将此 timeout_interval 更改为另一个更大的数字，但仍然出现此错误。

我的代码是：

beforeEach(async(() => {
  const storage = new Storage({         
    // Define Storage
    name: '__mydb',
    driverOrder: ['indexeddb', 'sqlite', 'websql']
  });  
    
  component = new HomepagePage(storage);

  TestBed.configureTestingModule({
    declarations: [ HomepagePage ],
    imports: [
      IonicModule.forRoot(), 
      RouterTestingModule,
      IonicStorageModule.forRoot()
    ]
  }).compileComponents();

  fixture = TestBed.createComponent(HomepagePage);
  component = fixture.componentInstance;
  fixture.detectChanges();
}));

it('should create', async () => {
  let home = jasmine.createSpyObj('home_spy',['getprice'])
  const result = await home.getprice
  expect(component).toBeTruthy();
});

describe('before logged in', () => {
  let home = jasmine.createSpyObj('home_spy',['getprice'])
    
  it('shows the price', async () => {
    const result = await home.getprice
    expect(home.getprice.length).toEqual(2);
  });
});

我的应用在使用时运行良好。但是，错误可能出在代码本身中吗？ getprice() 函数的一个例子是：

async getprice() {
    var price_eth :number
    var price_btc :number

    try {
        var url_btc = "https://api.binance.com/api/v1/klines?symbol=BTCUSDT&interval=1m";
        var url_eth = "https://api.binance.com/api/v1/klines?symbol=ETHUSDT&interval=1m"
        const btc = await axios.get(url_btc)
        const eth = await axios.get(url_eth)

        if (btc.data.length != 0 && eth.data.length != 0) {
           this.loaded = 'yes'
        } else { 
            this.loaded='no'
        }
        this.time = new Date(btc.data[btc.data.length-1][0]).toTimeString().replace(/.*(\d{2}:\d{2}:\d{2}).*/, "$1");
        price_btc = Math.floor(btc.data[btc.data.length-1][1])
        price_eth = Math.floor(eth.data[eth.data.length-1][1])

       //These global variables are declared so they display the price but they are not used for any other functions.
       this.glob_price_btc = price_btc
       this.glob_price_eth = price_eth

       return {
        'price_btc':price_btc,'price_eth':price_eth
       }

    } catch {
        this.loaded = 'no';
        return
    }
}

【问题讨论】：

标签： javascript typescript testing ionic-framework jasmine

【解决方案1】：

我想你误解了函数beforeEach()。 beforeEach() 应该用于设置测试环境，并将在执行单元测试之前调用。这是一个如何更正确并设置超时持续时间的示例。

describe("xyz test suite", () => {
    //called before every unittest
    beforeEach(function() {
        //Do setup stuff
    });
    
    it('shows the price', async () => {
        const result = await getSomething()
        expect(result).toEqual(2);
    });

}, 10000 <- Timeout in milliseconds)

【讨论】：