Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Source maps missing #96

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

Closed
TheCycoONE opened this issue Jun 12, 2018 · 2 comments
Closed

Source maps missing #96

TheCycoONE opened this issue Jun 12, 2018 · 2 comments
Labels

Comments

@TheCycoONE
Copy link
Contributor

TheCycoONE commented Jun 12, 2018

On my .vue templates the source map appears to be missing; breakpoints do not work in IntelliJ or vscode, and in Chrome's debugger the processed source code is shown instead of the original.

On my .js templates, processed by babel-jest everything works as expected in the IDEs and Chrome debugger.

At the end of my files processed by babel-jest I have a base64 encoded source map embedded in the file e.g.:

//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2Z ... snip ... gICAgICAgICB==
}});

No source map appears in my processed .vue files

var defaultExport = (module.exports.__esModule) ? module.exports.default : module.exports;var __vue__options__ = (typeof defaultExport === "function"? defaultExport.options: defaultExport)
__vue__options__.render = function render () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('span',{staticClass:"minitext",attrs:{"id":_vm.id},domProps:{"innerHTML":_vm._s(_vm.counterHtmlInternal)}},[_vm._v(_vm._s(_vm.counterHtmlInternal))])}
__vue__options__.staticRenderFns = []

}});

My jest configuration (from package.json):

  "jest": {
    "moduleFileExtensions": [
      "js",
      "json",
      "vue"
    ],
    "moduleNameMapper": {
      "^@/(.*)$": "<rootDir>/src/$1",
      "^@legacy/(.*)$": "<rootDir>/../main/webapp/includes/js/$1",
      "^@legacy2/(.*)$": "<rootDir>/../main/webapp/js/$1",
      "^raveGlobal$": "<rootDir>/src/js/commons/raveGlobal",
      "vue$": "vue/dist/vue.js"
    },
    "transform": {
      "^.+\\.js$": "<rootDir>/node_modules/babel-jest",
      ".*\\.(vue)$": "<rootDir>/node_modules/vue-jest"
    },
    "testPathIgnorePatterns": [
      "<rootDir>/test/e2e",
      "src/test.js"
    ],
    "snapshotSerializers": [
      "<rootDir>/node_modules/jest-serializer-vue"
    ],
    "setupFiles": [
      "<rootDir>/test/jest/setup"
    ],
    "coverageDirectory": "<rootDir>/test/jest/coverage",
    "collectCoverageFrom": [
      "src/**/*.{js,vue}",
      "!src/main.js",
      "!**/node_modules/**"
    ],
    "testResultsProcessor": "jest-teamcity-reporter"
  }

jest: v22.4.4
vue-jest: 2.6.0
source-map: 0.5.7

@aldarund
Copy link

aldarund commented Jun 22, 2018

Is it really bug in vue-jest? I tried to debug a bit and found that vue-jest process function generate and return map object to the jest itself. And jest create a map file in temp folder like this temp\jest\jest-transform-cache-aeed2fdb8d874223d633677bd2030000-eb1806becba3a17708d164f9003ab9fe\f4\

But debugger still dont work e.g. -> https://youtrack.jetbrains.com/issue/WEB-33399 but it might be up to ide to resolve...

@TheCycoONE
Copy link
Contributor Author

@aldarund I don't think it's possible for external tools to find/use the ones that are sent to jest. (Note that all debugging tools including Chrome are affected). Inline source maps are a best of both worlds as Jest is able to use them directly (no need to pass them in), and all other common debuggers can read them.

Both babel-jest and ts-jest produce inline source maps; I'm not aware of another transformer that passes the map directly to jest.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

3 participants