Skip to content

Commit 50e2253

Browse files
authored
fix(compiler/runtime-dom): ignore comments in inline styles (#6808)
fix #6807
1 parent 1c292e1 commit 50e2253

File tree

2 files changed

+26
-6
lines changed

2 files changed

+26
-6
lines changed

packages/compiler-sfc/__tests__/compileTemplate.spec.ts

+16
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,22 @@ test('should work', () => {
2222
expect(result.code).toMatch(`export function render(`)
2323
})
2424

25+
// #6807
26+
test('should work with style comment', () => {
27+
const source = `
28+
<div style="
29+
/* nothing */
30+
width: 300px;
31+
height: 100px/* nothing */
32+
">{{ render }}</div>
33+
`
34+
35+
const result = compile({ filename: 'example.vue', source })
36+
expect(result.errors.length).toBe(0)
37+
expect(result.source).toBe(source)
38+
expect(result.code).toMatch(`{"width":"300px","height":"100px"}`)
39+
})
40+
2541
test('preprocess pug', () => {
2642
const template = parse(
2743
`

packages/shared/src/normalizeProp.ts

+10-6
Original file line numberDiff line numberDiff line change
@@ -28,15 +28,19 @@ export function normalizeStyle(
2828

2929
const listDelimiterRE = /;(?![^(]*\))/g
3030
const propertyDelimiterRE = /:([^]+)/
31+
const styleCommentRE = /\/\*.*?\*\//gs
3132

3233
export function parseStringStyle(cssText: string): NormalizedStyle {
3334
const ret: NormalizedStyle = {}
34-
cssText.split(listDelimiterRE).forEach(item => {
35-
if (item) {
36-
const tmp = item.split(propertyDelimiterRE)
37-
tmp.length > 1 && (ret[tmp[0].trim()] = tmp[1].trim())
38-
}
39-
})
35+
cssText
36+
.replace(styleCommentRE, '')
37+
.split(listDelimiterRE)
38+
.forEach(item => {
39+
if (item) {
40+
const tmp = item.split(propertyDelimiterRE)
41+
tmp.length > 1 && (ret[tmp[0].trim()] = tmp[1].trim())
42+
}
43+
})
4044
return ret
4145
}
4246

0 commit comments

Comments
 (0)