无法断言 H1 文本

Question

我正在尝试写一些东西来检查以下页面上是否存在“关于我们”：https://www.aggrowth.com/en-us/about-us 我只是碰壁了。这应该不难，但我花了太多时间在这上面。

我们正在使用 Gherking-testcafe：https://www.npmjs.com/package/gherkin-testcafe

NPM：6.9.0

TestCafe：1.0.1

Gherking-Testcafe：2.0.0

我试过了（以下所有测试都是隔离的，也就是所有不同的 t.expect 都是自己运行的）：

  const h1AboutUs = await Selector('h1');

  await t.expect(h1AboutUs.innerText).eql('About Us');
  await t.expect(h1AboutUs.innerText).contains('About Us');
  await t.expect(h1AboutUs.value).eql('About Us');
  await t.expect(Selector('html').textContent).contains('About Us');

并尝试删除等待：

  const h1AboutUs = Selector('h1'); 

  await t.expect(h1AboutUs.innerText).eql('About Us');
  await t.expect(h1AboutUs.innerText).contains('About Us');
  await t.expect(h1AboutUs.value).eql('About Us');
  await t.expect(Selector('html').textContent).contains('About Us');

如果我这样做，它会起作用：

这是我的测试：

When("I see the page load", async t => {
  const h1AboutUs = await Selector('h1');

  await t.expect(h1AboutUs.visible).eql(true);
  await t.hover(h1AboutUs);
  await t.expect(h1AboutUs.value).contains('about');
  console.log(h1AboutUs.value);
});

我的 testCafe 跑步者：

const createTestCafe = require('gherkin-testcafe');
const fs = require('fs');
const reportPath = './frontend/src/tests/test-reports'
let testcafe = null;

function readTestCafeConfig() {
  configData = fs.readFileSync('.testcaferc.json', 'utf8');
  const js = JSON.parse(configData);
  return getJSONValues(js, 'src');
};

function getJSONValues(obj, key) {
  var objects = [];

  for (var i in obj) {
    if (!obj.hasOwnProperty(i)) continue;
    if (i === key) {
      objects.push(obj[i]);
    }
  }
  return objects;
}

createTestCafe('localhost', 1337, 1338)
  .then(tc => {
    testcafe = tc;
    const runner = testcafe.createRunner();
    const src = readTestCafeConfig();

    return runner
      .src([src])
      .browsers('chrome')
      .reporter(['spec', {
        name: 'json',
        output: `${reportPath}/report/report.json`
      },
        {
          name: 'xunit',
          output: `${reportPath}/report/report.xml`
        }])
      // .video(`${reportPath}/videos`, {
      //   singleFile: true,
      //   failedOnly: true,
      //   pathPattern: '${USERAGENT}/${FILE_INDEX}.mp4'
      // })
      .tags('@aboutUs')
      .run();
  })
  .then(failedCount => {
    console.log('Tests failed: ' + failedCount);
    testcafe.close();
  });

我在控制台中得到的错误是：

1) Selector cannot implicitly resolve the test run in context of which it should be executed. If you need to call Selector from the Node.js API callback, pass the test controller manually via
      Selector's `.with({ boundTestRun: t })` method first. Note that you cannot execute Selector outside the test code.

      Browser: Chrome 74.0.3729 / Mac OS X 10.14.4

         12 |});
         13 |
         14 |When("I see the page load", async t => {
         15 |  const h1AboutUs = await Selector('h1');
         16 |
       > 17 |  await t.expect(h1AboutUs.visible).eql(true);
         18 |  await t.hover(h1AboutUs);
         19 |  await t.expect(h1AboutUs.value).contains('about');
         20 |  console.log(h1AboutUs.value);
         21 |});
         22 |

我希望不会看到此错误消息

Answer 1

对于此类测试，您需要将 Selector 绑定到 TestCafe 的测试控制器。请看下面的例子：

const { Given, Then, Before } = require('cucumber');
const { Selector: NativeSelector }  = require('testcafe');

const Selector = (input, t) => {
    return NativeSelector(input).with({ boundTestRun: t });
};

Before('@aboutHook', async () => {
    console.log('Running AGI test.');
});

Given("I am open AGI page", async t => {
    await t.navigateTo('https://www.aggrowth.com/en-us/about-us');
});

Then("I should see check about us", async t => {
    const h1AboutUs = Selector('h1', t); 
    //or const h1AboutUs = await Selector('h1', t); if you need

    await t
        .expect(h1AboutUs.visible).eql(true)
        .hover(h1AboutUs);
});

您可以在gherkin-testcafe repository 中获得更多示例。 还要注意h1 元素没有value 属性。 您可以在 TestCafe 文档中了解有关 TestCafe Selectors 和 their properties 的更多信息。