Bug 253041 – CSSStyleRule.selectorText contains unquoted colon

• Component: CSS
• Status: RESOLVED DUPLICATE

CSSStyleRule.selectorText contains unquoted colons. Recreating rules with colons leads to broken syntax.

Steps to reproduce:
# Open `about:blank`
# Run the following piece of code, the red box is not shown in Safari.

const styleElement = document.createElement('style')
styleElement.innerHTML = `
[a\\:b], .red {
  background-color: red;
  width: 100px;
  height: 100px;
}
`
const divElement = document.createElement('div')
divElement.className = 'red'
document.body.append(styleElement, divElement)

console.log(styleElement.sheet.cssRules[0].selectorText + " should be [a\\:b], .red")
styleElement.innerHTML = styleElement.sheet.cssRules[0].cssText

[Radar WebKit Bug Importer]

<rdar://problem/106330426>

[Anne van Kesteren]

Thanks for taking the time to report this; I recently fixed this.

*** This bug has been marked as a duplicate of bug 184604 ***