wallabyjs / public

Repository for Wallaby.js questions and issues
http://wallabyjs.com
759 stars 45 forks source link

Failing import on CSS files #2389

Closed tomitrescak closed 4 years ago

tomitrescak commented 4 years ago

Issue description or question

PLEASE NOTE: If you are using If you are using Jest >= v24 or Angular CLI >= v8.2 and using a wallaby configuration file, switching to use automatic configuration may resolve your problem.

https://wallabyjs.com/docs/intro/config.html#automatic-configuration

Hi, I am using mocha to test my react app application, with rendering done in node.js, not browser. The issue is that all the css imports are throwing errors. Can I somehow "stub" the css imports?

Thanks

Wallaby diagnostics report

{
  editorVersion: '1.43.2',
  pluginVersion: '1.0.190',
  editorType: 'VSCode',
  osVersion: 'darwin 19.4.0',
  nodeVersion: 'v12.8.0',
  coreVersion: '1.0.875',
  config: {
    files: [
      { pattern: 'src/setup.ts', ignore: false, trigger: true, load: true, instrument: true, order: 1 },
      { pattern: 'src/**/*.ts', ignore: false, trigger: true, load: true, instrument: true, order: 2 },
      { pattern: 'src/**/*.tsx', ignore: false, trigger: true, load: true, instrument: true, order: 3 },
      { pattern: 'src/**/*.test.ts', ignore: true, trigger: true, load: true, instrument: true },
      { pattern: 'src/**/*.test.tsx', ignore: true, trigger: true, load: true, instrument: true },
      { pattern: 'src/**/*.css', ignore: true, load: false, instrument: false, trigger: true }
    ],
    tests: [
      { pattern: 'src/**/*.test.ts', ignore: false, trigger: true, load: true, test: true, order: 4 },
      { pattern: 'src/**/*.test.tsx', ignore: false, trigger: true, load: true, test: true, order: 5 }
    ],
    env: { type: 'node', NODE_ENV: 'test', params: {}, runner: '/usr/local/bin/node', viewportSize: { width: 800, height: 600 }, options: { width: 800, height: 600 }, bundle: true },
    testFramework: { version: 'mocha@2.1.0', configurator: 'mocha@2.1.0', reporter: 'mocha@2.1.0', starter: 'mocha@2.1.0' },
    compilers: { '**/*.?(lit)coffee?(.md)': [Function] },
    workers: { initial: 1, regular: 1, recycle: false },
    reportUnhandledPromises: true,
    teardown: "function(wallaby) {\n      // var fs = require('fs');\n      // console.log('Cleanup ...');\n      // return fs.db.disconnect();\n    }",
    diagnostics: {},
    filesWithNoCoverageCalculated: [],
    runAllTestsInAffectedTestFile: false,
    preprocessors: {},
    maxConsoleMessagesPerTest: 100,
    autoConsoleLog: true,
    delays: { run: 0, edit: 100, update: 0 },
    hints: {
      ignoreCoverage: '__REGEXP /ignore coverage|istanbul ignore/',
      ignoreCoverageForFile: '__REGEXP /ignore file coverage/',
      commentAutoLog: '?',
      testFileSelection: { include: '__REGEXP /file\\.only/', exclude: '__REGEXP /file\\.skip/' }
    },
    automaticTestFileSelection: true,
    runSelectedTestsOnly: false,
    extensions: {},
    slowTestThreshold: 75,
    lowCoverageThreshold: 80,
    loose: undefined,
    configCode: "var path = require('path');\n" +
      "// var Prisma = require('@generated/photon');\n" +
      '\n' +
      "process.env.NODE_PATH += path.delimiter + path.resolve('../../node_modules');\n" +
      '\n' +
      'module.exports = function(wallaby) {\n' +
      "  var path = require('path');\n" +
      "  process.env.NODE_PATH += path.delimiter + path.resolve(path.join(wallaby.projectCacheDir, 'src'));\n" +
      '\n' +
      '  return {\n' +
      '    files: [\n' +
      "      // './mocha.js',\n" +
      "      'src/setup.ts',\n" +
      "      'src/**/*.ts',\n" +
      "      'src/**/*.tsx',\n" +
      "      '!src/**/*.test.ts',\n" +
      "      '!src/**/*.test.tsx',\n" +
      "      { pattern: 'src/**/*.css', ignore: true, load: false, instrument: false }\n" +
      '    ],\n' +
      "    tests: ['src/**/*.test.ts', 'src/**/*.test.tsx'],\n" +
      '    env: {\n' +
      "      type: 'node',\n" +
      "      NODE_ENV: 'test'\n" +
      '    },\n' +
      "    testFramework: 'mocha',\n" +
      '    compilers: {\n' +
      "      '**/*.ts?(x)': wallaby.compilers.typeScript({\n" +
      "        module: 'commonjs',\n" +
      "        jsx: 'react'\n" +
      '      })\n' +
      '    },\n' +
      '    workers: {\n' +
      '      initial: 1,\n' +
      '      regular: 1\n' +
      '    },\n' +
      '    reportUnhandledPromises: true,\n' +
      '    setup: function(wallaby) {\n' +
      "      // require('./src/setup');\n" +
      "      // process.env.NODE_ENV = 'test';\n" +
      "      // var fs = require('fs');\n" +
      '      // if (fs.db && !fs.db.engine.exiting) {\n' +
      "      //   console.log('We still got it!!!');\n" +
      "      //   return fs.db.connect().then(() => console.log('Connected!!!'));\n" +
      '      // }\n' +
      "      // var Prisma = require('@generated/photon');\n" +
      '      // var photon = new Prisma.Photon();\n' +
      '      // fs.db = photon;\n' +
      "      console.log('starting setup');\n" +
      '      const mocha = wallaby.testFramework;\n' +
      "      mocha.suite.on('pre-require', function() {\n" +
      "        require(wallaby.projectCacheDir + '/src/setup');\n" +
      '      });\n' +
      '    },\n' +
      '    teardown: function(wallaby) {\n' +
      "      // var fs = require('fs');\n" +
      "      // console.log('Cleanup ...');\n" +
      '      // return fs.db.disconnect();\n' +
      '    }\n' +
      '  };\n' +
      '};\n'
  },
  packageJSON: {
    dependencies: {
      '@apollo/client': '^3.0.0-beta.41',
      '@apollo/react-common': '^3.1.3',
      '@emotion/styled': '^10.0.27',
      '@storybook/react': '^5.3.17',
      '@testing-library/cypress': '^6.0.0',
      '@testing-library/react': '^10.0.1',
      '@tomino/toolbelt': '^1.2.6',
      '@types/react-alert': '^5.2.0',
      '@types/react-datepicker': '^2.11.0',
      '@types/react-draft-wysiwyg': '^1.13.0',
      '@types/shortid': '^0.0.29',
      '@types/testing-library__cypress': '^5.0.3',
      'apollo-link-batch-http': '^1.2.13',
      'apollo-link-error': '^1.1.12',
      'babel-plugin-jsx-control-statements': '^4.1.0',
      'bpmn-js': '^6.3.4',
      'bpmn-js-properties-panel': '^0.33.2',
      'bpmn-moddle': '^6.0.2',
      'camunda-bpmn-moddle': '^4.4.0',
      classnames: '^2.2.6',
      'date-fns': '^2.11.0',
      'draft-js': '^0.11.4',
      'draftjs-to-html': '^0.9.1',
      emotion: '^10.0.27',
      'eslint-plugin-cypress': '^2.10.3',
      'evergreen-ui': '^4.24.0',
      faker: '^4.1.0',
      'fuse-box': '4.0.0-next.165',
      graphql: '^14.6.0',
      'graphql-tag': '^2.10.3',
      'json-schema-faker': '^0.5.0-rc23',
      marked: '^0.8.2',
      mobx: '^5.15.4',
      'mobx-keystone': '^0.43.0',
      'mobx-react': '^6.1.8',
      'mocha-jsdom': '^2.0.0',
      react: '^16.13.1',
      'react-datepicker': '^2.14.1',
      'react-dom': '^16.13.1',
      'react-draft-wysiwyg': '^1.14.4',
      'react-input-mask': '^2.0.4',
      'react-multi-split-pane': '^0.3.1',
      'react-router': '^5.1.2',
      'react-router-dom': '^5.1.2',
      'react-scripts': '^3.4.1',
      'react-scroll': '^1.7.16',
      'react-simple-code-editor': '^0.11.0',
      'react-transition-group': '^4.3.0',
      'react-vis': '^1.11.7',
      'shipit-cli': '^5.3.0',
      'shipit-deploy': '^5.3.0',
      'tsconfig-paths-webpack-plugin': '^3.2.0',
      tslib: '^1.11.1',
      typescript: '^3.8.3',
      webfontloader: '^1.6.28',
      'xml-formatter': '^1.2.0',
      'z-schema': '^4.2.2'
    },
    devDependencies: {
      '@graphql-codegen/cli': '^1.13.1',
      '@graphql-codegen/typescript': '^1.13.1',
      '@graphql-codegen/typescript-operations': '^1.13.1',
      '@graphql-codegen/typescript-react-apollo': '^1.13.1',
      '@testing-library/jest-dom': '^5.4.0',
      '@types/jest': '^25.1.4',
      '@types/marked': '^0.7.3',
      '@types/react': '16.9.25',
      '@types/react-dom': '^16.9.5',
      '@types/react-router-dom': '^5.1.3',
      '@types/react-scroll': '^1.5.4',
      '@types/react-transition-group': '^4.2.4',
      cypress: '^4.2.0',
      remotedev: '^0.2.9'
    }
  },
  fs: { numberOfFiles: 470 },
  debug: [
    '2020-04-09T03:58:10.385Z project Wallaby Node version: v12.8.0\n',
    '2020-04-09T03:58:10.386Z project Wallaby config: <homeDir>/Github/apps/corpix/apps/client/wallaby.js\n',
    '2020-04-09T03:58:11.275Z project File cache: <homeDir>/.vscode/extensions/wallabyjs.wallaby-vscode-1.0.190/projects/7493eba33302f6bc\n',
    '2020-04-09T03:58:11.283Z uiService Listening port 51235\n',
    '2020-04-09T03:58:11.294Z project Config file change detected, invalidating local cache\n',
    '2020-04-09T03:58:11.382Z workers Parallelism for initial run: 1, for regular run: 1\n',
    '2020-04-09T03:58:11.382Z workers Starting run worker instance #0\n',
    '2020-04-09T03:58:11.383Z workers Web server is listening at 63288\n',
    '2020-04-09T03:58:11.383Z project File cache requires some updates, waiting required files from IDE\n',
    '2020-04-09T03:58:12.190Z workers Started run worker instance (delayed) #0\n',
    '2020-04-09T03:58:12.365Z uiService UI client connected\n',
    '2020-04-09T03:58:12.370Z uiService Outgoing message ui:handshake\n',
    '2020-04-09T03:58:12.380Z uiService Incoming message ui:tests:resultsRequested\n',
    '2020-04-09T03:58:12.382Z uiService Outgoing message ui:tests:allResultsUpdated\n',
    '2020-04-09T03:58:12.384Z uiService Incoming message ui:start\n',
    '2020-04-09T03:58:12.385Z uiService Outgoing message ui:summary\n',
    '2020-04-09T03:58:12.389Z uiService Outgoing message ui:files\n',
    '2020-04-09T03:58:13.049Z project Stopping process pool\n',
    '2020-04-09T03:58:13.082Z uiService Outgoing message ui:busy\n',
    '2020-04-09T03:58:13.083Z project Running postprocessor\n',
    '2020-04-09T03:58:13.103Z postprocessor New TypeScript language service is required\n',
    '2020-04-09T03:58:25.245Z project Postprocessor execution finished\n',
    '2020-04-09T03:58:25.246Z project Test run started; run priority: 3\n',
    '2020-04-09T03:58:25.250Z project Running all tests\n',
    '2020-04-09T03:58:25.263Z workers Starting test run, priority: 3\n',
    '2020-04-09T03:58:25.263Z nodeRunner Starting sandbox [worker #0, session #ohlix]\n',
    '2020-04-09T03:58:25.264Z nodeRunner Preparing sandbox [worker #0, session #ohlix]\n',
    '2020-04-09T03:58:25.264Z nodeRunner Prepared sandbox [worker #0, session #ohlix]\n',
    '2020-04-09T03:58:25.264Z workers [worker #0, session #ohlix] Running tests in sandbox\n',
    '2020-04-09T03:58:26.506Z workers Sandbox (active) [ohlix] error: Unexpected token *=\n',
    '2020-04-09T03:58:26.608Z workers [ohlix] Run 0 test(s), skipped 0 test(s)\n',
    '2020-04-09T03:58:26.610Z workers [ohlix] Sandbox is responsive, closing it\n',
    '2020-04-09T03:58:26.616Z project Test run finished\n',
    '2020-04-09T03:58:26.616Z project Processed console.log entries\n',
    '2020-04-09T03:58:26.616Z project Processed loading sequences\n',
    '2020-04-09T03:58:26.617Z project Processed executed tests\n',
    '2020-04-09T03:58:26.645Z project Processed code coverage\n',
    '2020-04-09T03:58:26.771Z project Test run result processed and sent to IDE\n',
    '2020-04-09T03:58:26.771Z uiService Outgoing message ui:summary\n',
    '2020-04-09T03:58:26.772Z uiService Outgoing message ui:tests:allResultsUpdated\n',
    '2020-04-09T03:58:26.778Z uiService Outgoing message ui:coverageChanged\n'
  ]
}
ArtemGovorov commented 4 years ago

Hi Tomas, this should help:

setup: function(wallaby) {
+ require.extensions['.css'] = () => {};
  ...
tomitrescak commented 4 years ago

Thanks! Marvellous, as usual!