javascript - 用 Jest 测试 html 页面

标签 javascript jestjs

我正在尝试为 prototype.js 设置测试。 我想避免启动本地服务器来使用 cypress/puppeteer/等。我的目标是使用 jest。

我的想法是让每个测试都有一个最小的 index.html,如下所示:

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <script src="https://ajax.googleapis.com/ajax/libs/prototype/1.7.2.0/prototype.js"></script>
    </head>
    <body>
        <span id="el">foo foo</span>
    </body>
</html>

我首先尝试将 jest 运行为

const fs = require('fs');
const path = require('path');
const html = fs.readFileSync(path.resolve(__dirname, './index.html'), 'utf8');
jest.dontMock('fs');
describe('$', function () {
    beforeEach(() => {
        document.documentElement.innerHTML = html.toString();
    });
    afterEach(jest.resetModules);
    it('finds a node', function () {
        expect($('el')).toBeInTheDocument()
    });
});

但是 $ 因为所有 prototype.js 全局的东西都不可用。

最佳答案

ouhhh ....看起来将 expect 包装到 window.onload 中就足够了,这也很有意义。

关于javascript - 用 Jest 测试 html 页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/66616114/

相关文章:

javascript - 对设置 NODE_ENV 的方式有多少感到困惑

javascript - 如何在测试中手动设置变量的值( Jest )?

javascript - 如何使用渲染 Prop 通过 Jest 正确模拟 React 组件

javascript - 需要测试复合 React 组件是否调用处理程序 prop

jestjs - 如何为每个测试模拟不同的 useLocation 值?

javascript - TypeError : studentsList. forEach 不是函数。 Jasmine 单元测试(Angular 2)

javascript - jQuery:将 $(this) 传递给命名函数事件处理程序

javascript - 从 Node.js 服务器修改 HTML 网站以显示文件数据

javascript - 更新 .php 页面的部分内容

javascript - Jest : Change output of manual mock for different tests within a test suite