Skip to content

Commit

Permalink
Don't adjust SVG text in forced colors mode
Browse files Browse the repository at this point in the history
As per the following spec resolution, SVG text no longer should be
adjusted in forced colors mode by default.
w3c/csswg-drafts#3855

Bug: 970285
Change-Id: I11a785f64ca6f7e7840b17d6b59d4ce9b9f8b4e1
  • Loading branch information
alisonmaher authored and chromium-wpt-export-bot committed Feb 19, 2020
1 parent 52f9e48 commit c066647
Show file tree
Hide file tree
Showing 8 changed files with 104 additions and 94 deletions.
36 changes: 36 additions & 0 deletions forced-colors-mode/forced-colors-mode-18-ref.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>Forced colors mode - svg.
Only foreignObject svg elements should have styles
overridden in forced colors mode.
</title>
<style>
svg, text, foreignObject {
forced-color-adjust: none;
}
</style>
<body>
<svg height="600" width="600">
<text x="0" y="15" fill="red" stroke="blue">
This text should have a red fill and blue stroke color in
forced colors mode.
</text>
<rect x="0" height="60" y="30" width="180" style="fill: red; stroke: blue;"/>
<foreignObject x="20" y="100" width="160" height="160">
<div xmlns="http://www.w3.org/1999/xhtml" style="color: orange;">
This text should be orange in forced colors mode due to inheritance.
</div>
<svg height="20" width="20">
<rect x="0" height="20" y="0" width="20" style="fill: green; stroke: purple;"/>
</svg>
</foreignObject>
</svg>

<svg height="600" width="600">
<foreignObject x="20" y="100" width="160" height="160" style="color: CanvasText;">
<div xmlns="http://www.w3.org/1999/xhtml">
This text should be CanvasText in forced colors mode.
</div>
</foreignObject>
</svg>
</body>
33 changes: 33 additions & 0 deletions forced-colors-mode/forced-colors-mode-18.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>Forced colors mode - svg.
Only foreignObject svg elements should have styles
overridden in forced colors mode.
</title>
<link rel="help" href="https://www.w3.org/TR/css-color-adjust-1/#forced-colors-properties">
<link rel=match href="forced-colors-mode-18-ref.html">
<body>
<svg height="600" width="600" style="color: orange">
<text x="0" y="15" fill="red" stroke="blue">
This text should have a red fill and blue stroke color in
forced colors mode.
</text>
<rect x="0" height="60" y="30" width="180" style="fill: red; stroke: blue;"/>
<foreignObject x="20" y="100" width="160" height="160" style="color: blue;">
<div xmlns="http://www.w3.org/1999/xhtml">
This text should be orange in forced colors mode due to inheritance.
</div>
<svg height="20" width="20">
<rect x="0" height="20" y="0" width="20" style="fill: green; stroke: purple;"/>
</svg>
</foreignObject>
</svg>

<svg height="600" width="600">
<foreignObject x="20" y="100" width="160" height="160" style="color: blue;">
<div xmlns="http://www.w3.org/1999/xhtml">
This text should be CanvasText in forced colors mode.
</div>
</foreignObject>
</svg>
</body>
28 changes: 0 additions & 28 deletions forced-colors-mode/forced-colors-mode-18.tentative-ref.html

This file was deleted.

27 changes: 0 additions & 27 deletions forced-colors-mode/forced-colors-mode-18.tentative.html

This file was deleted.

15 changes: 15 additions & 0 deletions forced-colors-mode/forced-colors-mode-26-ref.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>Forced colors mode - fill/stroke.
</title>
<style>
body {
forced-color-adjust: none;
}
</style>
<body>
The triangle below should be currentColor when forced colors mode.
<svg height="600" width="600">
<path fill="currentColor" d="M150 0 L75 200 L225 200 Z" />
</svg>
</body>
20 changes: 20 additions & 0 deletions forced-colors-mode/forced-colors-mode-26.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>Forced colors mode - fill/stroke.
</title>
<link rel="help" href="https://www.w3.org/TR/css-color-adjust-1/#forced-colors-properties">
<link rel=match href="forced-colors-mode-26-ref.html">
<style>
div {
fill: red;
stroke: blue;
}
</style>
<body>
<div>
The triangle below should be currentColor when forced colors mode.
<svg height="600" width="600">
<path d="M150 0 L75 200 L225 200 Z" />
</svg>
</div>
</body>
16 changes: 0 additions & 16 deletions forced-colors-mode/forced-colors-mode-26.tentative-ref.html

This file was deleted.

23 changes: 0 additions & 23 deletions forced-colors-mode/forced-colors-mode-26.tentative.html

This file was deleted.

0 comments on commit c066647

Please sign in to comment.