Jest: TypeError: replaceAll is not a function

Question

String.prototype.replaceAll() is a useful method and while building and executing everything works fine. However, all Jest-tests fail with the following error:

TypeError: replaceAll is not a function

These are my dependencies:

"dependencies": {
  "core-js": "^3.6.5",
  "vue": "^2.6.11",
  "vue-class-component": "^7.2.3",
  "vue-i18n": "^8.22.0",
  "vue-property-decorator": "^8.4.2",
  "vue-router": "^3.3.4",
  "vuex": "^3.5.1"
},
"devDependencies": {
  "@vue/test-utils": "^1.1.0",
  "jest-junit": "^12.0.0",
  "ts-jest": "^26.4.1",
  "typescript": "~3.9.3",
  "vue-jest": "^3.0.7",
  "vue-template-compiler": "^2.6.10"
},

How can I fix this behavior?

Answer 1

The problem

This happens because replaceAll is a new function not implemented in all browsers nor older Node.js versions, as mentioned in the other answer. You can see which browsers support it in Can I Use:

But, instead o using .replace with a RegExp, you can add a polyfill to support older browsers (if needed). In my case, I'm using Electron, so I need to do it for Jest only.

The shim can be found here.

The solution

Using as a polyfill for browsers

1. Install as a dependency with npm i string.prototype.replaceall or yarn add string.prototype.replaceall;

2. Add the following code in your project. It need to be added in one place only.

import replaceAllInserter from 'string.prototype.replaceall';

replaceAllInserter.shim();

Using in Jest only

Update Node.js

As @leonheess mentioned in the comments, you can update Node.js to a more recent version. You'll need a version that uses the version 8.5 from V8, which is when .replaceAll was implemented.

According to the list available on the Node.js website, neither version uses V8 8.5, but as of Node.js 15.0.0, the version 8.6 of V8 is used. So, upgrade to Node.js v15 or higher.

Use as a polyfill

If you want to fix this problem for Jest only, you can do as mentioned in this issue:

1. Install as a dev dependency with npm i -D string.prototype.replaceall or yarn add -D string.prototype.replaceall;

2. Modify your Jest config, add a setupFilesAfterEnv property as bellow:

{
  "jest": {
    "setupFilesAfterEnv": ["<rootDir>/jestSetup.js"]
  }
}

3. Add the following code to your jestSetup file:

import replaceAllInserter from 'string.prototype.replaceall';

replaceAllInserter.shim();

Answer 2

This most likely happens because String.prototype.replaceAll is not implemented in Node.js (at least as of version v14.15.0).

One alternative you could use are regular expressions like in this example:

const str = 'foo-foo';
const regex = /foo/g; // Note the 'g' flag, which matches all occurrences of the expression

console.log(str.replace(regex, 'bar')); // 'bar-bar'

You can check here for more info on regular expressions.

Answer 3

You can also add this anywhere in your main.js file

if (typeof String.prototype.replaceAll === "undefined") {
  String.prototype.replaceAll = function (match, replace) {
    return this.replace(new RegExp(match, 'g'), () => replace);
  }
}