Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

let the script processer pick custom transformers when present #154

Merged
merged 2 commits into from
Jan 31, 2019
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 4 additions & 0 deletions e2e/__projects__/custom-transformers/babel-transformer.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
const { createTransformer } = require('babel-jest')
module.exports = createTransformer({
presets: ['@babel/preset-env']
})
3 changes: 0 additions & 3 deletions e2e/__projects__/custom-transformers/babel.config.js

This file was deleted.

2 changes: 1 addition & 1 deletion e2e/__projects__/custom-transformers/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@
"vue"
],
"transform": {
"^.+\\.js$": "babel-jest",
"^.+\\.js$": "./babel-transformer.js",
"^.+\\.vue$": "vue-jest"
},
"moduleNameMapper": {
Expand Down
6 changes: 2 additions & 4 deletions lib/process-style.js
Original file line number Diff line number Diff line change
Expand Up @@ -59,10 +59,8 @@ module.exports = function processStyle(stylePart, filename, config = {}) {
getGlobalResources(vueJestConfig.resources, stylePart.lang) +
stylePart.content

const transformer = getCustomTransformer(
vueJestConfig['transform'],
stylePart.lang
)
const transformer =
getCustomTransformer(vueJestConfig['transform'], stylePart.lang) || {}

// pre process
if (transformer.preprocess) {
Expand Down
10 changes: 6 additions & 4 deletions lib/process.js
Original file line number Diff line number Diff line change
Expand Up @@ -10,19 +10,21 @@ const path = require('path')
const getVueJestConfig = require('./utils').getVueJestConfig
const logResultErrors = require('./utils').logResultErrors
const stripInlineSourceMap = require('./utils').stripInlineSourceMap
const getCustomTransformer = require('./utils').getCustomTransformer
const throwError = require('./utils').throwError
const babelTransformer = require('babel-jest')
const compilerUtils = require('@vue/component-compiler-utils')
const convertSourceMap = require('convert-source-map')
const generateCode = require('./generate-code')

function resolveTransformer(lang, vueJestConfig) {
function resolveTransformer(lang = 'js', vueJestConfig) {
const transformer = getCustomTransformer(vueJestConfig['transform'], lang)
if (/^typescript$|tsx?$/.test(lang)) {
return typescriptTransformer
return transformer || typescriptTransformer
} else if (/^coffee$|coffeescript$/.test(lang)) {
return coffeescriptTransformer
return transformer || coffeescriptTransformer
} else {
return babelTransformer
return transformer || babelTransformer
}
}

Expand Down
13 changes: 7 additions & 6 deletions lib/typescript-transformer.js
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ module.exports = {
ensureRequire('typescript', ['typescript'])
const typescript = require('typescript')
const vueJestConfig = getVueJestConfig(config)
const { tsconfig } = getTsJestConfig(config)
const tsconfig = getTsJestConfig(config)
const babelOptions = getBabelOptions(filePath)

const res = typescript.transpileModule(scriptContent, tsconfig)
Expand All @@ -24,15 +24,16 @@ module.exports = {
// handle ES modules in TS source code in case user uses non commonjs module
// output and there is no .babelrc.
let inlineBabelOptions = {}
if (tsconfig.compilerOptions.module !== 'commonjs' && !babelOptions) {
if (
tsconfig.compilerOptions.module !== typescript.ModuleKind.CommonJS &&
!babelOptions
) {
inlineBabelOptions = {
plugins: [require('@babel/plugin-transform-modules-commonjs')]
}
}
const customTransformer = getCustomTransformer(
vueJestConfig['transform'],
'js'
)
const customTransformer =
getCustomTransformer(vueJestConfig['transform'], 'js') || {}
const transformer = customTransformer.process
? customTransformer
: babelJest.createTransformer(
Expand Down
5 changes: 3 additions & 2 deletions lib/utils.js
Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,8 @@ const getBabelOptions = function loadBabelOptions(filename, options = {}) {

const getTsJestConfig = function getTsJestConfig(config) {
const tr = createTransformer()
return tr.configsFor(config)
const { typescript } = tr.configsFor(config)
return { compilerOptions: typescript.options }
Copy link
Contributor Author

@yohodopo yohodopo Jan 31, 2019

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Or we could do something like the this to make sure we dont depend on ts-jest to fetch tsConfig options when users do not use ts-jest at all.

const getTsJestConfig = function getTsJestConfig(config = {}) {
  const vueTsConfig = getVueJestConfig(config)
  if (typeof vueTsConfig.tsConfig === 'string') {
    return getTsConfigJson(vueTsConfig.tsConfig)
  } else if (typeof vueTsConfig.tsConfig === 'object') {
    return vueTsConfig.tsConfig
  } else if (config.globals && config.globals['ts-jest']) {
    const tr = createTransformer()
    const {
      typescript: { options: compilerOptions }
    } = tr.configsFor(config)
    return { compilerOptions }
  } else {
    // auto pick tsconfig from the root folder
    return getTsConfigJson()
  }
}

const getTsConfigJson = function getTsConfigJson(
  pathToConfig = path.resolve(process.cwd(), './tsconfig.json')
) {
  const configJson = ts.parseConfigFileTextToJson(
    pathToConfig,
    ts.sys.readFile(pathToConfig)
  )
  const { options: compilerOptions } = ts.parseJsonConfigFileContent(
    configJson.config,
    ts.sys,
    ts.getDirectoryPath(pathToConfig),
    {},
    pathToConfig
  )
  return { compilerOptions }
}

Or should we use @babel/preset-typescript to transpile .ts files?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@eddyerburgh thoughts?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

For most use cases it would be fine to compile with Babel, it would also simplify the code. The only problem would be if users use const enums, namespaces, or export = or import =.

I haven't seen anyone using those features in components, so I think we can go ahead with using Babel for compiling TypeScript.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Since we added ts-jest, Jest added native support for TypeScript in v24 (which uses Babel), so I think we are fine to remove ts-jest and just use Babel.

Copy link
Member

@eddyerburgh eddyerburgh Jan 31, 2019

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can you please make this change in a new PR

}

function isValidTransformer(transformer) {
Expand Down Expand Up @@ -93,7 +94,7 @@ const getCustomTransformer = function getCustomTransformer(
}
return transformer
}
return {}
return null
}

const throwError = function error(msg) {
Expand Down
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@
"format": "prettier --no-semi --single-quote --write '**/*.{js,json,md}'",
"format:check": "prettier --no-semi --single-quote --check '**/*.{js,json,md}'",
"lint": "eslint --ignore-path .gitignore '{,!(node_modules)/**/}*.js'",
"lint:fix": "npm run lint -- --fix",
"lint:fix": "npm run lint --fix",
"release": "semantic-release",
"test": "npm run lint && npm run format:check && npm run test:e2e",
"test:e2e": "node e2e/test-runner"
Expand Down