Having a regex working for both Chrome and Safari

Question

We encountered some problems in Safari browsers with the regex that we are using. This was the regex:

/(?<=type: ).*./g

Safari could not handle this and therefore we changed it to this:

/(?:)(type: ).*./g

The problem with this is that now for Chrome it does not return the right value back. Is there a way to have a regex working for both Chrome and Safari with the same response. So desired response is:

BUSINESS
ACC
false

Code Example

const query = "{\n          testObject(testInput : {\n            id: \"id-13\",\n            life: ACC,\n            type: BUSINESS,\n            promo: [],\n            isvalid: false\n          })}\n      }"

const pattern = /\(([^)]+)\)/g;
const result = query.match(pattern) ? query.match(pattern).map((v) => v.trim().replace(/^\(|\)$/g, ''))[0] : null;

/* DOES NOT WORK IN SAFARI */
const queryTypePattern = /(?<=type: ).*./g;
const queryLifePattern = /(?<=life: ).*./g;
const queryIsValidPattern = /(?<=isvalid: ).*./g;

const queryType = result.match(queryTypePattern) ? result.match(queryTypePattern).map((v) => v.trim().replace(',', ''))[0] : null;
const queryLife = result.match(queryLifePattern) ? result.match(queryLifePattern).map((v) => v.trim().replace(',', ''))[0] : null;
const queryIsValid = result.match(queryIsValidPattern) ? result.match(queryIsValidPattern).map((v) => v.trim().replace(',', ''))[0] : null;

console.log('#### RETURNS THE CORRECT OUTPUT IN CHROME: ');
console.log(queryType);
console.log(queryLife);
console.log(queryIsValid);


/* WORKS IN SAFARI */
const queryTypePattern2 = /(?:type: ).*./g;
const queryLifePattern2 = /(?:life: ).*./g;
const queryIsValidPattern2 = /(?:isvalid: ).*./g;

const queryType2 = result.match(queryTypePattern2) ? result.match(queryTypePattern2).map((v) => v.trim().replace(',', ''))[0] : null;
const queryLife2 = result.match(queryLifePattern2) ? result.match(queryLifePattern2).map((v) => v.trim().replace(',', ''))[0] : null;
const queryIsValid2 = result.match(queryIsValidPattern2) ? result.match(queryIsValidPattern2).map((v) => v.trim().replace(',', ''))[0] : null;

console.log('#### RETURNS THE INCORRECT OUTPUT IN CHROME: ');
console.log(queryType2);
console.log(queryLife2);
console.log(queryIsValid2);

Answer 1

You could capture .* and match without the global flag.

/(?:type: )(.*)/

In this way, it returns an array of two strings:

• full matched value (ex: type: BUSINESS)
• captured group (ex: BUSINESS)

We need the second one.

const query = "{\n          testObject(testInput : {\n            id: \"id-13\",\n            life: ACC,\n            type: BUSINESS,\n            promo: [],\n            isvalid: false\n          })}\n      }"

const pattern = /\(([^)]+)\)/g;
const result = query.match(pattern) ? query.match(pattern).map((v) => v.trim().replace(/^\(|\)$/g, ''))[0] : null;

const queryTypePattern2 = /(?:type: )(.*)/;
const queryLifePattern2 = /(?:life: )(.*)/;
const queryIsValidPattern2 = /(?:isvalid: )(.*)/;

const queryType2 = result.match(queryTypePattern2) ? result.match(queryTypePattern2).map((v) => v.trim().replace(',', ''))[1] : null;
const queryLife2 = result.match(queryLifePattern2) ? result.match(queryLifePattern2).map((v) => v.trim().replace(',', ''))[1] : null;
const queryIsValid2 = result.match(queryIsValidPattern2) ? result.match(queryIsValidPattern2).map((v) => v.trim().replace(',', ''))[1] : null;

console.log(queryType2);
console.log(queryLife2);
console.log(queryIsValid2);

As the solution does not contain lookbehind, it will work for both browsers.