dom-parser icon indicating copy to clipboard operation
dom-parser copied to clipboard

Tag regex issue

Open ahsan-sabir opened this issue 3 years ago • 0 comments

The tag regex is incorrectly parsing use tags in svg

const tagRegExp          = /(<\/?[a-z][a-z0-9]*(?::[a-z][a-z0-9]*)?\s*(?:\s+[a-z0-9-_]+=(?:(?:'[\s\S]*?')|(?:"[\s\S]*?")))*\s*\/?>)|([^<]|<(?![a-z\/]))*/gi

const html = `<mask id="mask">
  <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#clip1"></use>
  <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#clip2"></use>
</mask>`

const tags = html.match(tagRegExp)

console.log(tags)
// Outputs [
//   '<mask id="mask">',
//   '\n  ',
//   '',
//   'use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#clip1">',
//   '</use>',
//   '\n  ',
//   '',
//   'use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#clip2">',
//   '</use>',
//   '\n',
//   '</mask>',
//   ''
// ]

Notice the missing opening brackets (<) in parsed use tag

ahsan-sabir avatar May 29 '21 18:05 ahsan-sabir