Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(regex): global flag should not reuse without reset lastIndex #3116

Closed
wants to merge 4 commits into from
Closed

fix(regex): global flag should not reuse without reset lastIndex #3116

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
26c725d
fix(regex): global flag should not be reuse without reset lastIndex
Oct 11, 2023
f68d98a
feat: add changeset
Oct 11, 2023
1795eac
fix: comment
Oct 11, 2023
d2cb4c2
fix
Oct 11, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 7 additions & 0 deletions .changeset/four-waves-dance.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
---
'@emotion/babel-plugin': patch
'@emotion/jest': patch
'@emotion/serialize': patch
---

fix(regex): global flag should not reuse without reset lastIndex
5 changes: 3 additions & 2 deletions packages/babel-plugin/src/utils/label.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,10 +6,11 @@ type LabelFormatOptions = {
path: string
}

const invalidClassNameCharacters = /[!"#$%&'()*+,./:;<=>?@[\]^`|}~{]/g
const getInvalidClassNameCharactersRegex = () =>
/[!"#$%&'()*+,./:;<=>?@[\]^`|}~{]/g

const sanitizeLabelPart = (labelPart: string) =>
labelPart.trim().replace(invalidClassNameCharacters, '-')
labelPart.trim().replace(getInvalidClassNameCharactersRegex(), '-')

function getLabel(
identifierName?: string,
Expand Down
4 changes: 2 additions & 2 deletions packages/jest/src/utils.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -152,7 +152,7 @@ export function getClassNamesFromNodes(nodes: Array<any>) {

const keyframesPattern = /^@keyframes\s+(animation-[^{\s]+)+/

const removeCommentPattern = /\/\*[\s\S]*?\*\//g
const getRemoveCommentPattern = () => /\/\*[\s\S]*?\*\//g

const getElementRules = (element: HTMLStyleElement): string[] => {
const nonSpeedyRule = element.textContent
Expand Down Expand Up @@ -256,7 +256,7 @@ export function getStylesFromClassNames(
})
}

return (keyframesStyles + styles).replace(removeCommentPattern, '')
return (keyframesStyles + styles).replace(getRemoveCommentPattern(), '')
}

export function getStyleElements(): Array<HTMLStyleElement> {
Expand Down
20 changes: 10 additions & 10 deletions packages/serialize/src/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,16 +16,16 @@ https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_liter
const UNDEFINED_AS_OBJECT_KEY_ERROR =
"You have passed in falsy value as style object's key (can happen when in example you pass unexported component as computed key)."

let hyphenateRegex = /[A-Z]|^ms/g
let animationRegex = /_EMO_([^_]+?)_([^]*?)_EMO_/g
const getHyphenateRegex = () => /[A-Z]|^ms/g
const getAnimationRegex = () => /_EMO_([^_]+?)_([^]*?)_EMO_/g

const isCustomProperty = (property: string) => property.charCodeAt(1) === 45
const isProcessableValue = value => value != null && typeof value !== 'boolean'

const processStyleName = /* #__PURE__ */ memoize((styleName: string) =>
isCustomProperty(styleName)
? styleName
: styleName.replace(hyphenateRegex, '-$&').toLowerCase()
: styleName.replace(getHyphenateRegex(), '-$&').toLowerCase()
)

let processStyleValue = (
Expand All @@ -36,7 +36,7 @@ let processStyleValue = (
case 'animation':
case 'animationName': {
if (typeof value === 'string') {
return value.replace(animationRegex, (match, p1, p2) => {
return value.replace(getAnimationRegex(), (match, p1, p2) => {
cursor = {
name: p1,
styles: p2,
Expand Down Expand Up @@ -67,7 +67,7 @@ if (process.env.NODE_ENV !== 'production') {
let oldProcessStyleValue = processStyleValue

let msPattern = /^-ms-/
let hyphenPattern = /-(.)/g
const getHyphenPattern = () => /-(.)/g

let hyphenatedCache = {}

Expand Down Expand Up @@ -98,7 +98,7 @@ if (process.env.NODE_ENV !== 'production') {
console.error(
`Using kebab-case for css properties in objects is not supported. Did you mean ${key
.replace(msPattern, 'ms-')
.replace(hyphenPattern, (str, char) => char.toUpperCase())}?`
.replace(getHyphenPattern(), (str, char) => char.toUpperCase())}?`
)
}

Expand Down Expand Up @@ -192,7 +192,7 @@ function handleInterpolation(
if (process.env.NODE_ENV !== 'production') {
const matched = []
const replaced = interpolation.replace(
animationRegex,
getAnimationRegex(),
(match, p1, p2) => {
const fakeVarName = `animation${matched.length}`
matched.push(
Expand Down Expand Up @@ -297,9 +297,9 @@ function createStringFromObject(

let labelPattern = /label:\s*([^\s;\n{]+)\s*(;|$)/g

let sourceMapPattern
let getSourceMapPattern
if (process.env.NODE_ENV !== 'production') {
sourceMapPattern =
getSourceMapPattern = () =>
/\/\*#\ssourceMappingURL=data:application\/json;\S+\s+\*\//g
}

Expand Down Expand Up @@ -347,7 +347,7 @@ export const serializeStyles = function (
let sourceMap

if (process.env.NODE_ENV !== 'production') {
styles = styles.replace(sourceMapPattern, match => {
styles = styles.replace(getSourceMapPattern(), match => {
sourceMap = match
return ''
})
Expand Down