part 2: Fix typos in WPT css-border-radius-001.html and change colori…

…ng so that its expected rendering doesn't have red. In rendering WPTs, red is often used to signal failure (particularly when combined with green), as documented here: https://web-platform-tests.org/writing-tests/rendering.html Differential Revision: https://phabricator.services.mozilla.com/D174339 bugzilla-url: https://bugzilla.mozilla.org/show_bug.cgi?id=1825865 gecko-commit: 2df50fff5cd428b8def5f1bc3563b9f277c944b2 gecko-reviewers: TYLin
cookiecrook · Apr 8, 2023 · b164631 · b164631
1 parent 0217142
commit b164631
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 8 deletions.
diff --git a/css/css-backgrounds/css-border-radius-001.html b/css/css-backgrounds/css-border-radius-001.html
@@ -6,13 +6,13 @@
     <link rel="help" href="http://www.w3.org/TR/css3-background/#the-border-radius">
     <link rel="match" href="reference/css-border-radius-001-ref.html">
     <style type="text/css">
-		.redSquare{
+		.blueSquare{
             position: absolute;
 			top:50px;
 			left:50px;
             width: 100px;
             height: 100px;
-			background-color:rgba(255, 0, 0, 1);
+			background-color:rgba(0, 0, 255, 1);
 		}
         .greenSquare {
             position: absolute;
@@ -29,10 +29,10 @@
     </style>
 </head>
 <body>
-    <p>The test passes if you the green is inscribed circle of the red square.</p>
+    <p>The test passes if the green circle is inscribed in the blue square.</p>
     <div class="container">
         <!-- This is the square that has a inscribed circle if the test passes -->
-		<div id="red" class="redSquare"></div>
+		<div id="blue" class="blueSquare"></div>
         <!-- This is the square being tested with the radius-->
 		<div id="green" class="greenSquare"></div>
     </div>

diff --git a/css/css-backgrounds/reference/css-border-radius-001-ref.html b/css/css-backgrounds/reference/css-border-radius-001-ref.html
@@ -3,13 +3,13 @@
 <head>
     <title>CSS border-radius Test</title>
     <style type="text/css">
-		.redSquare{
+		.blueSquare{
             position: absolute;
 			top:50px;
 			left:50px;
             width: 100px;
             height: 100px;
-			background-color:rgba(255, 0, 0, 1);
+			background-color:rgba(0, 0, 255, 1);
 		}
         .greenSquare {
             position: absolute;
@@ -26,10 +26,10 @@
     </style>
 </head>
 <body>
-    <p>The test passes if you the green is inscribed circle of the red square.</p>
+    <p>The test passes if the green circle is inscribed in the blue square.</p>
     <div class="container">
         <!-- This is the square that has a inscribed circle if the test passes -->
-		<div id="red" class="redSquare"></div>
+		<div id="blue" class="blueSquare"></div>
         <!-- This is the square being tested with the radius-->
 		<div id="green" class="greenSquare"></div>
     </div>