Question

我正在尝试运行我的第一个testcafe测试，但事实证明这很艰巨。

testcafe -e chrome客户端/路由/查询/组件/testcafe/lookup-test.js

SyntaxError: client/routes/Lookup/components/Lookup.js: Unexpected token (60:8)
  58 |     if (error.status && error.status !== 404) {
  59 |       return (
> 60 |         <NetworkIssues code={error.status} />
     |         ^
  61 |       );
  62 |     }
  63 |
at Object.<anonymous> (client/routes/Lookup/components/testcafe/lookup-test.js:1:1)

lookup-test.js

import Lookup from '../Lookup';
import React from 'react';
import { waitForReact } from 'testcafe-react-selectors';


fixture('Lookup Component').page('http://localhost:3000/web/lookup').beforeEach(async () => {
  await waitForReact();
});

test('foo', async (x) => {
  await x
    .typeText('customerName', '07450118811')
    .expect('customerName.value').contains('07450118811');
});

我的代码没有任何错误。它可以编译并正常工作，并通过了我所有的笑话和酶单位测试。但是我在网上找不到任何指导。如您所见，忽略错误标志用于无济于事。

干杯。

Answer 1

尝试对此进行评论

//import Lookup from '../Lookup'

Answer 2

启动TestCafe时，将在执行之前第一步将所有测试代码进行编译。即使您的代码是纯JavaScript，执行的操作也是该编译过程的结果，而不是原始源代码。

导入的文件client/routes/Lookup/components/Lookup.js是一个JSX文件，由于它是通过TestCafe代码导入的，因此在开始执行测试之前，首先将il编译为javascript。

TestCafe的翻译过程（在撰写本文时可能会在将来更改）未配置为处理JSX文件。

因此，您不能导入不能由TestCafe转换为纯JS的文件。

Answer 3

TestCafe无法在类组件之外处理JSX。如果您使用react，并创建一个返回JSX的函数，则testCafe会抛出该错误。您可以通过仅创建一个新的类组件来解决它。有关更多详细信息，请参见TestCafé + React JSX error (unexpected Token)。

Testcafe无法识别React

3 个答案: