Cypress ParseError: «import» и «export» могут появляться только с «sourceType: module» - PullRequest
Новая
       89

Cypress ParseError: «import» и «export» могут появляться только с «sourceType: module»

0 голосов
/ 06 декабря 2018

Я обновил Cypress с 3.0.3 до 3.1.3.Я использую ES6 импорт / экспорт модулей, которые должны работать, связанные с документами.Но я получаю строку с undefined в терминале и следующую ошибку в графическом интерфейсе: 

<root_dir>/node_modules/@babel/runtime/helpers/esm/defineProperty.js:1
export default function _defineProperty(obj, key, value) {
^
ParseError: 'import' and 'export' may appear only with 'sourceType: module'

Мои тесты в vanilla JS, без TS os CoffeeScript.Я застрял, в 3.0.3 все работало нормально.

Ответы [ 2 ]

0 голосов
/ 20 июня 2019

Эта ошибка вызвана наличием современных ключевых слов, таких как «импорт» и «экспорт», когда Cypress работает в браузере.В отличие от Selenium или Protractor - он работает внутри браузера.Так как браузеры пока не поддерживают современный JS, вам нужно использовать webpack или browserify для переноса вашего кода.

https://docs.cypress.io/api/plugins/preprocessors-api.html#Examples

Вот фантастическое сообщение в блоге о том, как получить Cypressдля работы с современными JS и Typescript с помощью веб-пакета: https://glebbahmutov.com/blog/use-typescript-with-cypress/

^^ Пост посвящен TypeScript, но параметры конфигурации для Javascript будут аналогичными.

Следующие пакеты npm должны бытьустановлен и в вашем package.json: 

"@cypress/webpack-preprocessor": "^4.1.0",
"cypress": "^3.3.1",
"ts-loader": "^6.0.3",
"typescript": "^3.5.2",
"webpack": "^4.34.0"

Веб-пакет должен быть установлен с помощью: 

npm install --save-dev webpack typescript ts-loader
npm install --save-dev @cypress/webpack-preprocessor

В разделе «compilerOptions» файла с именем tsconfig.json должно присутствовать следующеев корневом каталоге с параметром allowJs, установленным в true для пользователей, не набирающих текст: 

"module": "es6",
"target": "es6",
"types": ["cypress"],
"allowJs": true

В корневом каталоге должен присутствовать файл с именем "webpack.config.js" со следующим: 

const path = require('path')

module.exports = {
  entry: './src/index.ts',
  module: {
    rules: [
      {
        test: /\.tsx?$/,
        use: 'ts-loader',
        exclude: /node_modules/
      }
    ]
  },
  resolve: {
    extensions: ['.tsx', '.ts', '.js']
  },
  output: {
    filename: 'bundle.js',
    path: path.resolve(__dirname, 'dist')
  }
}

И этот экспорт должен присутствовать в cypress / plugins / index.js: 

const webpack = require('@cypress/webpack-preprocessor')
module.exports = on => {
  const options = {
    // send in the options from your webpack.config.js, so it works the same
    // as your app's code
    webpackOptions: require('../../webpack.config'),
    watchOptions: {}
  }

  on('file:preprocessor', webpack(options))
}

Обратите внимание на этот последний бит в конце файла плагинов Cypress, 

on('file:preprocessor', webpack(options))

ЭтоCypress должен обрабатывать ваш современный код JS таким образом, чтобы сделать его работоспособным на Cypress.

0 голосов
/ 06 декабря 2018

Я решил, в моей корневой папке был файл babel.config.js, который, возможно, переопределил конфиги Cypress.После того как я его удалил, все работает.¯ \ _ (ツ) _ / ¯

Обновление: Возможно, магия была прочитана babel.config.js с этим содержанием, основанным на этой проблеме: https://github.com/cypress-io/cypress/issues/2945

module.exports = process.env.CYPRESS_ENV
  ? {}
  : { presets: ['@vue/babel-preset-app'] }
...