3

I'm importing a vue file with just scripts in vue file with only template tag
And then I import js files to help me to do what I need
In this last imports are the problem (I think), but is just this file, because I already tested with another ones and test passes

PS: sorry for my newbie question and my english, this is my very first question. Thank you for your attention

sales.test.js

import ApexChart from 'vue-apexcharts'
import BootstrapVue from 'bootstrap-vue'
import sinon from 'sinon'
import { shallowMount, createLocalVue } from '@vue/test-utils'

import salesPage from '../src/views/vendas/Vendas'

package.json

"jest": {
    "moduleFileExtensions": [
      "js",
      "vue"
    ],
    "moduleNameMapper": {
      "^@/(.*)$": "<rootDir>/src/$1"
    },
    "transform": {
      "^[^.]+.(vue|jsx)$": "vue-jest",
      "^.+\\.(js|jsx)$": "babel-jest"
    },
    "snapshotSerializers": ["jest-serializer-vue"]
  }

.babelrc

{
  "presets": [
    [
      "@babel/preset-env",
      {
        "useBuiltIns": "entry",
        "corejs": 2,
        "targets": {
          "esmodules": true,
          "node": "current"
        }
      }
    ]
  ],
  "plugins": [
    ["@babel/plugin-syntax-dynamic-import"],
    ["@babel/plugin-syntax-jsx"],
    [
      "@babel/plugin-transform-runtime",
      {
        "corejs": 2,
        "regenerator": true
      }
    ]
  ]
}

functions.js

'use strict'

import moment from 'moment'

export function dateFormatter(date) {
  return moment(date).format('DD/MM/YYYY')
}

export function changeInitialDate(date) {
  if (date) {
    this.disabledDatesEnd = null
    this.disabledDatesEnd = new Object()
    this.disabledDatesEnd.to = new Date(date)
  }
}

export function changeFinalDate(date) {
  if (date) {
    this.disabledDatesStart = null
    this.disabledDatesStart = new Object()
    this.disabledDatesStart.from = new Date(date)
  }
}

export function cnpjFormatter(cnpj) {
  return cnpj.toString().replace(/[^0-9a-zA-Z]+/g, '')
}

error

Jest encountered an unexpected token

    This usually means that you are trying to import a file which Jest cannot parse, e.g. it's not plain JavaScript.

    By default, if Jest sees a Babel config, it will use that to transform your files, ignoring "node_modules".

    Here's what you can do:
     • To have some of your "node_modules" files transformed, you can specify a custom "transformIgnorePatterns" in your config.
     • If you need a custom transformation specify a "transform" option in your config.
     • If you simply want to mock your non-JS modules (e.g. binary assets) you can stub them out with the "moduleNameMapper" config option.

    You'll find more details and examples of these config options in the docs:
    https://jestjs.io/docs/en/configuration.html

    Details:

    SyntaxError: /home/victor/development/accesys/AccCRM/Sources/cliente-web-clientes/unknown: Unexpected token (16:0)

      14 |   changeFinalDate,
      15 |   cnpjFormatter,
    > 16 | } from "../../functions";
         | ^
      17 | 
      18 | import {
      19 |   onClassChange,

      at Object._raise (node_modules/@babel/parser/src/parser/error.js:60:45)
      at Object.raiseWithData (node_modules/@babel/parser/src/parser/error.js:55:17)
      at Object.raise (node_modules/@babel/parser/src/parser/error.js:39:17)
      at Object.unexpected (node_modules/@babel/parser/src/parser/util.js:139:16)
      at Object.parseExprAtom (node_modules/@babel/parser/src/parser/expression.js:1186:20)
      at Object.parseExprAtom (node_modules/@babel/parser/src/plugins/jsx/index.js:535:22)
      at Object.parseExprSubscripts (node_modules/@babel/parser/src/parser/expression.js:563:23)
      at Object.parseUpdate (node_modules/@babel/parser/src/parser/expression.js:543:21)
      at Object.parseMaybeUnary (node_modules/@babel/parser/src/parser/expression.js:527:17)
      at Object.parseExprOps (node_modules/@babel/parser/src/parser/expression.js:343:23)

Test Suites: 1 failed, 1 total
Tests:       0 total
Snapshots:   0 total
Time:        1.524s
1
  • If you could share your files from your functions folder that would be helpful :) Commented Sep 16, 2020 at 12:12

1 Answer 1

2

Could it be the trailing comma in your import?

From this:

import { changeFinalDate, cnpjFormatter, } from "../../functions";
                                       ^

To this:

import { changeFinalDate, cnpjFormatter } from "../../functions";
Sign up to request clarification or add additional context in comments.

2 Comments

This worked, but now I have another error in the name of the component, like: export default { name: 'Vendas' -> unexpected token, expected "}"
Try removing the curly braces from your import statement. As far as I recall you only use the curly braces on import when a function is exported with the defaults flag in js. so try: import changeFinalDate, cnpjFormatter from "../../functions";

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.