賞金將在 6 天后到期。此問題的答案有資格獲得 50聲望賞金。 ag-dev希望引起對這個問題的更多關注。
我嘗試了很多在互聯網上尋找解決我的問題的方法，但是我找不到任何可以幫助我的東西。
我有一個 JS 實用程式檔案，可以讓我測驗值。這是組成它的功能之一：
const colorIsValid = (color) => {
if (!color || typeof color !== 'string') {
return false
}
if (CSS !== undefined) {
if (CSS.supports('color', color)) {
return true
}
throw new Error(`The provided color : "${color}" is not valid`)
}
throw new Error('Your navigator do not support CSS Api')
}
export { colorIsValid }
當我在不同的瀏覽器上進行手動測驗時，一切正常。但是，當我使用 Jest 運行測驗時，出現以下錯誤：
ReferenceError: CSS is not defined
這是我目前的環境。
// package.json
{
"name": "vue-polygon-grid",
"version": "1.0.0",
"description": "Interactive polygon structure for Vue.js",
"author": {
"name": "Guyomar Alexis",
"email": "[email protected]",
"url": "https://ag-dev.fr/"
},
"main": "dist/data-tables.min.js",
"homepage": "https://github.com/ga-devfront/vue-polygon-grid-private",
"keywords": [
"vue3",
"vuejs",
"vue",
"grid",
"polygon",
"composition"
],
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint",
"test": "jest"
},
"dependencies": {
"core-js": "^3.20.2",
"vue": "^3.0.0"
},
"devDependencies": {
"@babel/core": "^7.16.7",
"@babel/preset-env": "^7.16.8",
"@vue/cli-plugin-babel": "~4.5.15",
"@vue/cli-plugin-eslint": "~4.5.15",
"@vue/cli-service": "~4.5.15",
"@vue/compiler-sfc": "^3.2.26",
"@vue/eslint-config-airbnb": "^6.0.0",
"babel-eslint": "^10.1.0",
"babel-jest": "^27.4.6F",
"eslint": "^7.32.0",
"eslint-plugin-import": "^2.25.4",
"eslint-plugin-jest": "^25.3.4",
"eslint-plugin-vue": "^8.2.0",
"jest": "27.4.7",
"jest-junit": "13.0.0",
"jest-transform-stub": "^2.0.0",
"sass": "^1.38.0",
"sass-loader": "^10"
}
}
// jest.config.js
module.exports = {
clearMocks: true,
collectCoverage: true,
coverageDirectory: 'coverage',
"collectCoverageFrom": [
"**/utility/*.{js,jsx}",
],
coverageReporters: ['html', 'text', 'text-summary', 'cobertura'],
transform: {
'^. \\.js$': 'babel-jest',
'. \\.(css|styl|less|sass|scss|png|jpg|jpeg|svg|ttf|woff|woff2)$': 'jest-transform-stub',
},
reporters: [
'default',
['jest-junit', { outputDirectory: 'coverage' }],
],
};
有沒有人有解決方案，所以我可以測驗我的方法？提前感謝您花時間閱讀我。
uj5u.com熱心網友回復：
jest 通過 Node 運行時運行，這意味著沒有瀏覽器 API。你需要模擬它。查看笑話setupFiles。
創建一個設定檔案：
global.CSS = {
supports: (k, v) => false,
}
然后使用該設定檔案將CSS物件添加到全域物件上。
這個答案也可能會有所幫助。
uj5u.com熱心網友回復：
如果您真的必須擁有 DOM API，您可以包含可以提供幫助的包 JSDOM。在我看來，在大多數情況下，這是不必要的依賴。
從您的問題看來，您只需要運行測驗即可。你真的需要設定全域 CSS 物件嗎？你確定你不是在測驗實作細節嗎？
轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/417615.html
標籤：