1

Solved

In case anyone comes across this later, this is what I changed the RegEx to. Works perfectly now. I removed the < after ? like @WiktorStribiżew recommended. I also needed to add the [^/] after [^] 

var re = new RegExp('(?=(<a href="https://domainName.com/[0-9]{4,}/[0-9]{2,}/[0-9]{2,}/([^][^/]+)/">))');

Original Question

I'm having some trouble getting this regular expression to work in Firefox and IE 11. It works without issue in Chrome. 

var re = new RegExp('(?<=(<a href="https://domainName.com/[0-9]{4,}/[0-9]{2,}/[0-9]{2,}/([^]+)/">))');

The goal is to search through HTML code (returned by the WordPress REST API) and find links from a given domain that match the WordPress blog post link pattern and then grab the "slug" from the end of the URL.

Here is an example of what the RegEx returns in Chrome:

0: ""
1: "<a href="http://domainName.com/2018/02/05/some-post-slug/">"
2: "some-post-slug"

Firefox Error: "SyntaxError: invalid regexp group" (Firefox version 58.0.1 (64-bit))

IE11 Error: "SyntaxError: Unexpected quantifier" (IE11 version 11.0.9600.18893)

This code is running in an Angular 4 app with polyfills enabled. I'm a bit of a RegEx noob so any help is greatly appreciated.

polyfills.ts

/** IE9, IE10 and IE11 requires all of the following polyfills. **/
import 'core-js/es6/symbol';
import 'core-js/es6/object';
import 'core-js/es6/function';
import 'core-js/es6/parse-int';
import 'core-js/es6/parse-float';
import 'core-js/es6/number';
import 'core-js/es6/math';
import 'core-js/es6/string';
import 'core-js/es6/date';
import 'core-js/es6/array';
import 'core-js/es6/regexp';
import 'core-js/es6/map';
import 'core-js/es6/weak-map';
import 'core-js/es6/set';

/** IE10 and IE11 requires the following for NgClass support on SVG elements */
import 'classlist.js';  // Run `npm install --save classlist.js`.

/** IE10 and IE11 requires the following to support `@angular/animation`. */
import 'web-animations-js';  // Run `npm install --save web-animations-js`.


/** Evergreen browsers require these. **/
import 'core-js/es6/reflect';
import 'core-js/es7/reflect';


/** ALL Firefox browsers require the following to support `@angular/animation`. **/
// import 'web-animations-js';  // Run `npm install --save web-animations-js`.



/***************************************************************************************************
 * Zone JS is required by Angular itself.
 */
import 'zone.js/dist/zone';  // Included with Angular CLI.



/***************************************************************************************************
 * APPLICATION IMPORTS
 */

/**
 * Date, currency, decimal and percent pipes.
 * Needed for: All but Chrome, Firefox, Edge, IE11 and Safari 10
 */
import 'intl';  // Run `npm install --save intl`.
/**
 * Need to import at least one locale-data with intl.
 */
import 'intl/locale-data/jsonp/en';
Shipps
  • 76
  • 1
  • 6
  • Change the approach from getting a full match to capturing. Remove the `(?<=` and the corresponding `)`, wrap the other part of the pattern you need to get with capturing parentheses `()`, grab Group 1 value. – Wiktor Stribiżew Feb 05 '18 at 08:34
  • @WiktorStribiżew Thanks for the tip. Not sure I understand 100% but I'll do some googling on it. Thanks! – Shipps Feb 05 '18 at 08:35
  • On second thought, it looks like an overlapping string extraction pattern, just remove the `<` after `?`, i.e. `(?<=(` => `(?=(`. i.e. you may as well use a look**ahead** here. But the main point is that lookbehinds are not supported by all browsers. – Wiktor Stribiżew Feb 05 '18 at 08:37
  • @WiktorStribiżew Got it. Need to solve the problem without using lookbehinds. Thanks again! – Shipps Feb 05 '18 at 08:40

0 Answers0