Question

我正在尝试测试打字稿应用程序（没有任何js框架）。但是对此一无所知。可以完全使用测试库进行测试吗？

有人分享给我指南或帮助我测试这个简单的ts文件吗？

这是我的ts文件和测试文件：

export default class MyClass {
    constructor() {
        this.render();
    }

    render() {

        const el: HTMLInputElement = document.createElement('input') as HTMLInputElement;
        const link: HTMLAnchorElement = document.createElement('a') as HTMLAnchorElement;
        const container: HTMLBodyElement = document.querySelector('body') as HTMLBodyElement;

        link.innerHTML = 'Click Me!';
        link.setAttribute('href', '#');
        link.setAttribute('target', '_blank');

        el.setAttribute('type', 'file');
        container.appendChild(el);
        container.appendChild(link);

        el.addEventListener('change', (event) => {
            if ('files' in el) {
                const availFile: File = el.files![0];
                const blob = new Blob([availFile], { type: availFile.type });

                const objectURL = window.URL.createObjectURL(blob);
                link.setAttribute('href', objectURL);
            }
        });
    }
}

我尝试使用testing-library：但是对没有js框架的测试一无所知

导入{ 屏幕， getByLabelText， getByText， getByTestId， queryByTestId，等待 }，来自“ @ testing-library / dom”；

import MyClass from "./index";

describe('testing as first', () => {

    it("renders", () => {

    })

});

这是我的package.json：

{
  "name": "webpack",
  "version": "1.0.0",
  "main": "index.js",
  "license": "MIT",
  "scripts": {
    "start": "webpack-dev-server --config=webpack.dev.js",
    "build": "webpack --mode production",
    "test": "jest"
  },
  "devDependencies": {
    "@babel/core": "^7.8.0",
    "@babel/preset-env": "^7.8.2",
    "@babel/preset-typescript": "^7.8.0",
    "@testing-library/dom": "^6.11.0",
    "@types/jest": "^24.0.25",
    "babel-jest": "^24.9.0",
    "html-webpack-plugin": "^3.2.0",
    "jest": "^24.9.0",
    "jestpack": "^0.2.0",
    "ts-jest": "^24.3.0",
    "ts-loader": "^6.2.1",
    "typescript": "^3.7.4",
    "webpack": "^4.41.5",
    "webpack-cli": "^3.3.10",
    "webpack-dev-server": "^3.10.1"
  }
}

是否需要任何其他资源来安装？

Answer 1

dom测试库仅提供测试实用程序来测试组件。您缺少一种呈现组件的方法。

您可以使用Cypress或Puppeteer。这些库还具有一个测试库，可以使用dom测试库实用程序功能。

如何在测试libraray的过程中使用Jest测试打字稿应用程序？

1 个答案: