Question

我试图在Mocha中对React组件进行测试，但我一直在绊倒这个错误：

var os = (navigator.platform.match(/mac|win|linux/i) || ["other])[0].toLowerCase();

TypeError: Cannot read property 'match' of undefined

我理解错误意味着模块无法确定代码运行的平台。但是这个错误是从node_modules/brace/index.js抛出的，所以这不是我自己编写的。 Mocha是否有办法忽略这一点并继续进行测试？

这是我的package.json：

{
"name": "project",
"version": "0.2.0",
"description": "project",
"scripts": {
  "clean:build": "node ./bin/clean.js createdir",
  "build:html": "node ./bin/buildHtml.js",
  "deployProduction": "node ./bin/deployProduction.js",
  "start": "webpack-dev-server --config ./config/webpack.config.dev.js --hot --in line --progress",
  "serve": "npm run deployProduction&& supervisor --watch ./production-copy src/js/server",
  "prebuild": "npm run clean:build",
  "postbuild": "node ./bin/postBuild.js",
  "rebuild-win": "set BUILD_TYPE=preview& npm run prebuild & npm run build-win & npm run serve",
  "build": "set BUILD_TYPE=final& npm run prebuild & npm run build-win",
  "deploy": "npm run build & npm run serve",
  "build-win": "set NODE_ENV=production & npm run element-build & npm run build-doc & npm run build:html &  webpack -p --config ./config/webpack.config.prod.js --json > webpack.log.json & npm run postbuild",
  "lint": "eslint config src/js/**/*.js",
  "jscs": "jscs src/js/",
  "test": "mocha --compilers js:babel-core/register --require ./test/unit/dom.js --recursive ./test/*.spec.js ",
  "test:watch": "npm run test -- --watch",
  "element-init": "node node_modules/element-theme/bin/element-theme -i src/js/core/ui/element-theme.css",
  "element-build": "node node_modules/element-theme/bin/element-theme -c src/js/core/ui/element-theme.css -o src/js/core/ui/element-theme ",
  "build-doc": "node bin/buildDoc.js "
},
"repository": {
  "type": "git",
  "url": "<our repository>"
},
"license": "MIT",
"bugs": {
  "url": "<our url>"
},
"homepage": "<our homepage>",
"dependencies": {
  "autoprefixer": "^6.3.6",
  "axios": "^0.11.1",
  "babel-standalone": "^6.10.3",
  "bluebird": "^3.4.0",
  "brace": "^0.8.0",
  "browserify": "^13.0.1",
  "classnames": "2.2.3",
  "cls-bluebird": "^1.0.1",
  "codemirror": "^5.16.0",
  "continuation-local-storage": "^3.1.7",
  "dateformat": "^1.0.12",
  "diff": "^3.0.1",
  "element-theme": "^0.4.0",
  "element-ui": "^1.1.5",
  "express-history-api-fallback": "^2.0.0",
  "filedrop": "^2.0.0",
  "fs-extra": "^0.30.0",
  "history": "^2.0.2",
  "humps": "^1.0.0",
  "isomorphic-fetch": "^2.2.1",
  "jszip": "^3.0.0",
  "jszip-utils": "0.0.2",
  "lodash": "^4.11.1",
  "material-ui": "^0.16.2",
  "materialize-css": "^0.97.6",
  "normalizr": "^1.0.0",
  "raven-js": "^3.9.1",
  "react": "^15.4.2",
  "react-ace": "^4.1.4",
  "react-dom": "^15.4.2",
  "react-redux": "^5.0.2",
  "react-router": "^3.0.2",
  "react-router-redux": "^4.0.8",
  "react-tap-event-plugin": "^2.0.1",
  "redux": "^3.4.0",
  "redux-logger": "^2.6.1",
  "redux-saga": "^0.9.5",
  "request": "^2.72.0",
  "request-promise": "^3.0.0",
  "save-as": "^0.1.7",
  "showdown": "^1.4.2",
  "three": "^0.79.0",
  "vue": "^2.0.5",
  "vue-loader": "^9.8.1",
  "vue-router": "^2.0.1",
  "vue-slider-component": "^2.0.4",
  "walk": "^2.3.9"
},
"devDependencies": {
  "babel-core": "^6.7.6",
  "babel-eslint": "^6.1.0",
  "babel-loader": "^6.0.2",
  "babel-plugin-react-transform": "^2.0.2",
  "babel-polyfill": "^6.6.1",
  "babel-preset-airbnb": "^2.2.3",
  "babel-preset-es2015": "^6.6.0",
  "babel-preset-react": "^6.5.0",
  "babel-preset-stage-2": "^6.5.0",
  "babel-register": "^6.7.2",
  "chai": "^3.5.0",
  "chai-jquery": "2.0.0",
  "cheerio": "^0.22.0",
  "colors": "1.1.2",
  "concurrently": "^2.0.0",
  "copy-webpack-plugin": "2.1.1",
  "css-loader": "0.23.1",
  "element-theme-default": "^1.1.5",
  "enzyme": "^2.7.1",
  "eslint": "^2.13.1",
  "eslint-config-airbnb": "^9.0.1",
  "eslint-plugin-react": "^5.2.2",
  "express": "^4.13.4",
  "extract-text-webpack-plugin": "1.0.1",
  "file-loader": "0.8.5",
  "jquery": "2.2.3",
  "jscs": "3.0.3",
  "jsdoc-to-markdown": "^2.0.0",
  "jsdom": "^9.11.0",
  "mocha": "^3.2.0",
  "ncp": "^2.0.0",
  "node-sass": "3.7.0",
  "postcss-loader": "0.8.2",
  "react-addons-test-utils": "^15.4.2",
  "react-hot-loader": "^1.3.1",
  "react-transform-hmr": "^1.0.4",
  "redux-devtools": "^3.3.1",
  "redux-devtools-dock-monitor": "^1.1.1",
  "redux-devtools-log-monitor": "^1.0.11",
  "remotedev": "^0.1.2",
  "rimraf": "^2.5.2",
  "sass-loader": "3.2.0",
  "style-loader": "0.13.1",
  "url-loader": "0.5.7",
  "webpack": "^1.13.0",
  "webpack-dev-middleware": "^1.6.1",
  "webpack-dev-server": "1.14.1",
  "webpack-hot-middleware": "^2.10.0"
}

Answer 1

要解决此问题，正如OP提到的那样，您需要在测试设置中设置navigator并包含两个属性：platform和appName。

以下是您的测试设置脚本应包含的内容，以便正确设置：

var exposedProperties = ['window', 'navigator', 'document'];
global.window = document.defaultView;
global.navigator = {
    userAgent: 'node.js',
    platform: 'windows', // This can be set to mac, windows, or linux
    appName: "Microsoft Internet Explorer", // Be sure to define this as well
};

Answer 2

发现问题：我正在重新创建navigator变量并忘记将platform成员放入其中。

使用Brace运行Mocha测试时，navigator.platform未定义

2 个答案: