Angular 量角器在包含 Chart.js 的页面上测试超时

Question

我的问题是，通过简单地将 Chart.js 组件添加到我的 html，它破坏了我之前工作的组件量角器测试。它似乎在等待 Protractor.waitForAngular() - 而从不等待 returns。在视觉上，我几乎可以立即看到图表呈现 - 所以没有问题。

我的期望是 e2e 测试照常通过 - 没有任何变化影响测试的运行 - 除了新的“等待图表” - 这是这个问题的基础。

protractor.conf.js:

const {SpecReporter} = require('jasmine-spec-reporter');

exports.config = {
  allScriptsTimeout: 11000,
  specs: [
    './src/**/*.e2e-spec.ts',
  ],
  capabilities: {
    'browserName': 'chrome',
    chromeOptions: {
      args: ['--window-size=1280,800'],
    }
  },
  directConnect: true,
  baseUrl: 'http://rubytoo.local:4202/',
  framework: 'jasmine',
  jasmineNodeOpts: {
    showColors: true,
    defaultTimeoutInterval: 30000,
    print: function () {
    }
  },
  // SELENIUM_PROMISE_MANAGER: false,
  onPrepare() {
    require('ts-node').register({
      project: require('path').join(__dirname, './tsconfig.e2e.json')
    });
    jasmine.getEnv().addReporter(new SpecReporter({spec: {displayStacktrace: true}}));
  }
};

我的组件：

 <canvas id="{{data.id}}" width="{{data.width}}" height="{{data.height}}"></canvas>

我的端到端测试：

  it('should display menu bar', () => {
     expect(browser.getCurrentUrl()).toEqual(`${URL}/admin/dashboard`);
   });

结果：

      ✗ should display submenu options
        - Expected false to be truthy.
            at /home/bruce/Projects/bwh-online/ruby/rubytoo-angular/e2e/src/admin.e2e-spec.ts:25:67
            at step (/home/bruce/Projects/bwh-online/ruby/rubytoo-angular/node_modules/tslib/tslib.js:141:27)
            at Object.next (/home/bruce/Projects/bwh-online/ruby/rubytoo-angular/node_modules/tslib/tslib.js:122:57)
            at /home/bruce/Projects/bwh-online/ruby/rubytoo-angular/node_modules/tslib/tslib.js:115:75
            at new Promise (<anonymous>)
            at Object.__awaiter (/home/bruce/Projects/bwh-online/ruby/rubytoo-angular/node_modules/tslib/tslib.js:111:16)
            at UserContext.<anonymous> (/home/bruce/Projects/bwh-online/ruby/rubytoo-angular/e2e/src/admin.e2e-spec.ts:24:42)
            at /home/bruce/Projects/bwh-online/ruby/rubytoo-angular/node_modules/jasminewd2/index.js:112:25
            at new ManagedPromise (/home/bruce/Projects/bwh-online/ruby/rubytoo-angular/node_modules/selenium-webdriver/lib/promise.js:1077:7)
        - Failed: script timeout
          (Session info: chrome=84.0.4147.105)
          (Driver info: chromedriver=84.0.4147.30 (48b3e868b4cc0aa7e8149519690b6f6949e110a8-refs/branch-heads/4147@{#310}),platform=Linux 5.0.0-32-generic x86_64)
          (Session info: chrome=84.0.4147.105)
          (Driver info: chromedriver=84.0.4147.30 (48b3e868b4cc0aa7e8149519690b6f6949e110a8-refs/branch-heads/4147@{#310}),platform=Linux 5.0.0-32-generic x86_64)
            at Object.checkLegacyResponse (/home/bruce/Projects/bwh-online/ruby/rubytoo-angular/node_modules/selenium-webdriver/lib/error.js:546:15)
            at parseHttpResponse (/home/bruce/Projects/bwh-online/ruby/rubytoo-angular/node_modules/selenium-webdriver/lib/http.js:509:13)
            at doSend.then.response (/home/bruce/Projects/bwh-online/ruby/rubytoo-angular/node_modules/selenium-webdriver/lib/http.js:441:30)
            at process._tickCallback (internal/process/next_tick.js:68:7)
        From: Task: Protractor.waitForAngular() - Locator: By(link text, Administration)

添加 Chart.js 组件以告知 tests/Angular/Protractor 图表已完成渲染时，我还需要做些什么吗？

Answer 1

我需要在端到端测试中添加以下两行。我还不太确定它为什么起作用，但确实如此。 ignoreSynchronization 似乎也已弃用，因此也请注意。

 it('should display menu bar', () => {
     browser.sleep(5000);                     //added
     browser.ignoreSynchronization = true;    //added 
     expect(browser.getCurrentUrl()).toEqual(`${URL}/admin/dashboard`);
   });

Angular 量角器在包含 Chart.js 的页面上测试超时

Angular protractor tests timeout on pages containing Chart.js

javascript

protractor

chart.js

e2e-testing

angular