fix #3122: prefix some more css properties

evanw · Jun 26, 2023 · 9ed47f5 · 9ed47f5
1 parent 9d8a7e5
commit 9ed47f5
Show file tree

Hide file tree

Showing 4 changed files with 57 additions and 0 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -42,6 +42,7 @@
     * `appearance: *;` => `-webkit-appearance: *; -moz-appearance: *;`
     * `backdrop-filter: *;` => `-webkit-backdrop-filter: *;`
     * `background-clip: text` => `-webkit-background-clip: text;`
+    * `box-decoration-break: *;` => `-webkit-box-decoration-break: *;`
     * `clip-path: *` => `-webkit-clip-path: *;`
     * `font-kerning: *;` => `-webkit-font-kerning: *;`
     * `hyphens: *;` => `-webkit-hyphens: *;`
@@ -54,6 +55,12 @@
     * `position: sticky;` => `position: -webkit-sticky;`
     * `print-color-adjust: *;` => `-webkit-print-color-adjust: *;`
     * `tab-size: *;` => `-moz-tab-size: *; -o-tab-size: *;`
+    * `text-decoration-color: *;` => `-webkit-text-decoration-color: *; -moz-text-decoration-color: *;`
+    * `text-decoration-line: *;` => `-webkit-text-decoration-line: *; -moz-text-decoration-line: *;`
+    * `text-decoration-skip: *;` => `-webkit-text-decoration-skip: *;`
+    * `text-emphasis-color: *;` => `-webkit-text-emphasis-color: *;`
+    * `text-emphasis-position: *;` => `-webkit-text-emphasis-position: *;`
+    * `text-emphasis-style: *;` => `-webkit-text-emphasis-style: *;`
     * `text-orientation: *;` => `-webkit-text-orientation: *;`
     * `text-size-adjust: *;` => `-webkit-text-size-adjust: *; -ms-text-size-adjust: *;`
     * `user-select: *;` => `-webkit-user-select: *; -moz-user-select: *; -ms-user-select: *;`

diff --git a/internal/compat/css_table.go b/internal/compat/css_table.go
@@ -144,6 +144,12 @@ var cssMaskPrefixTable = map[Engine]prefixData{
 	Safari: {prefix: WebkitPrefix, withoutPrefix: v{15, 4, 0}},
 }
 
+var cssTextEmphasisTable = map[Engine]prefixData{
+	Chrome: {prefix: WebkitPrefix, withoutPrefix: v{99, 0, 0}},
+	Edge:   {prefix: WebkitPrefix, withoutPrefix: v{99, 0, 0}},
+	Opera:  {prefix: WebkitPrefix, withoutPrefix: v{85, 0, 0}},
+}
+
 var cssPrefixTable = map[css_ast.D]map[Engine]prefixData{
 	// https://caniuse.com/css-appearance
 	css_ast.DAppearance: {
@@ -170,6 +176,15 @@ var cssPrefixTable = map[css_ast.D]map[Engine]prefixData{
 		Safari: {prefix: WebkitPrefix, withoutPrefix: v{14, 0, 0}},
 	},
 
+	// https://caniuse.com/css-boxdecorationbreak
+	css_ast.DBoxDecorationBreak: {
+		Chrome: {prefix: WebkitPrefix},
+		Edge:   {prefix: WebkitPrefix},
+		IOS:    {prefix: WebkitPrefix},
+		Opera:  {prefix: WebkitPrefix},
+		Safari: {prefix: WebkitPrefix},
+	},
+
 	// https://caniuse.com/css-clip-path
 	css_ast.DClipPath: {
 		Chrome: {prefix: WebkitPrefix, withoutPrefix: v{55, 0, 0}},
@@ -227,6 +242,30 @@ var cssPrefixTable = map[css_ast.D]map[Engine]prefixData{
 		Opera:   {prefix: OPrefix, withoutPrefix: v{15, 0, 0}},
 	},
 
+	// https://caniuse.com/mdn-css_properties_text-decoration-color
+	css_ast.DTextDecorationColor: {
+		Firefox: {prefix: MozPrefix, withoutPrefix: v{36, 0, 0}},
+		IOS:     {prefix: WebkitPrefix, withoutPrefix: v{12, 2, 0}},
+		Safari:  {prefix: WebkitPrefix, withoutPrefix: v{12, 1, 0}},
+	},
+
+	// https://caniuse.com/mdn-css_properties_text-decoration-line
+	css_ast.DTextDecorationLine: {
+		Firefox: {prefix: MozPrefix, withoutPrefix: v{36, 0, 0}},
+		IOS:     {prefix: WebkitPrefix, withoutPrefix: v{12, 2, 0}},
+		Safari:  {prefix: WebkitPrefix, withoutPrefix: v{12, 1, 0}},
+	},
+
+	// https://caniuse.com/mdn-css_properties_text-decoration-skip
+	css_ast.DTextDecorationSkip: {
+		IOS:    {prefix: WebkitPrefix, withoutPrefix: v{12, 2, 0}},
+		Safari: {prefix: WebkitPrefix, withoutPrefix: v{12, 1, 0}},
+	},
+
+	css_ast.DTextEmphasisColor:    cssTextEmphasisTable, // https://caniuse.com/mdn-css_properties_text-emphasis-color
+	css_ast.DTextEmphasisPosition: cssTextEmphasisTable, // https://caniuse.com/mdn-css_properties_text-emphasis-position
+	css_ast.DTextEmphasisStyle:    cssTextEmphasisTable, // https://caniuse.com/mdn-css_properties_text-emphasis-style
+
 	// https://caniuse.com/css-text-orientation
 	css_ast.DTextOrientation: {
 		Safari: {prefix: WebkitPrefix, withoutPrefix: v{14, 0, 0}},

diff --git a/internal/css_ast/css_decl_table.go b/internal/css_ast/css_decl_table.go
@@ -91,6 +91,7 @@ const (
 	DBorderTopWidth
 	DBorderWidth
 	DBottom
+	DBoxDecorationBreak
 	DBoxShadow
 	DBoxSizing
 	DBreakAfter
@@ -293,6 +294,7 @@ const (
 	DTextDecoration
 	DTextDecorationColor
 	DTextDecorationLine
+	DTextDecorationSkip
 	DTextDecorationStyle
 	DTextEmphasis
 	DTextEmphasisColor
@@ -416,6 +418,7 @@ var KnownDeclarations = map[string]D{
 	"border-top-width":            DBorderTopWidth,
 	"border-width":                DBorderWidth,
 	"bottom":                      DBottom,
+	"box-decoration-break":        DBoxDecorationBreak,
 	"box-shadow":                  DBoxShadow,
 	"box-sizing":                  DBoxSizing,
 	"break-after":                 DBreakAfter,
@@ -618,6 +621,7 @@ var KnownDeclarations = map[string]D{
 	"text-decoration":             DTextDecoration,
 	"text-decoration-color":       DTextDecorationColor,
 	"text-decoration-line":        DTextDecorationLine,
+	"text-decoration-skip":        DTextDecorationSkip,
 	"text-decoration-style":       DTextDecorationStyle,
 	"text-emphasis":               DTextEmphasis,
 	"text-emphasis-color":         DTextEmphasisColor,

diff --git a/internal/css_parser/css_parser_test.go b/internal/css_parser/css_parser_test.go
@@ -2131,6 +2131,7 @@ func TestPrefixInsertion(t *testing.T) {
 	// General "-webkit-" tests
 	for _, key := range []string{
 		"backdrop-filter",
+		"box-decoration-break",
 		"clip-path",
 		"font-kerning",
 		"initial-letter",
@@ -2140,6 +2141,10 @@ func TestPrefixInsertion(t *testing.T) {
 		"mask-repeat",
 		"mask-size",
 		"print-color-adjust",
+		"text-decoration-skip",
+		"text-emphasis-color",
+		"text-emphasis-position",
+		"text-emphasis-style",
 		"text-orientation",
 	} {
 		expectPrintedWithAllPrefixes(t,
@@ -2177,6 +2182,8 @@ func TestPrefixInsertion(t *testing.T) {
 	expectPrintedWithAllPrefixes(t, "a { position: sticky !important }", "a {\n  position: -webkit-sticky !important;\n  position: sticky !important;\n}\n")
 	expectPrintedWithAllPrefixes(t, "a { position: sticky }", "a {\n  position: -webkit-sticky;\n  position: sticky;\n}\n")
 	expectPrintedWithAllPrefixes(t, "a { tab-size: 2 }", "a {\n  -moz-tab-size: 2;\n  -o-tab-size: 2;\n  tab-size: 2;\n}\n")
+	expectPrintedWithAllPrefixes(t, "a { text-decoration-color: none }", "a {\n  -webkit-text-decoration-color: none;\n  -moz-text-decoration-color: none;\n  text-decoration-color: none;\n}\n")
+	expectPrintedWithAllPrefixes(t, "a { text-decoration-line: none }", "a {\n  -webkit-text-decoration-line: none;\n  -moz-text-decoration-line: none;\n  text-decoration-line: none;\n}\n")
 	expectPrintedWithAllPrefixes(t, "a { text-size-adjust: none }", "a {\n  -webkit-text-size-adjust: none;\n  -ms-text-size-adjust: none;\n  text-size-adjust: none;\n}\n")
 	expectPrintedWithAllPrefixes(t, "a { user-select: none }", "a {\n  -webkit-user-select: none;\n  -moz-user-select: -moz-none;\n  -ms-user-select: none;\n  user-select: none;\n}\n")