forked from mozilla/gecko-dev
-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Bug 1740618 [wpt PR 31587] - [css-conditional-3] Add basic @media tes…
…ts for rule application., a=testonly Automatic update from web-platform-tests [css-conditional-3] Add basic @media tests for rule application. -- wpt-commits: 57199113bf5a3ea44cc1f129c1b481f57464cb48 wpt-pr: 31587
- Loading branch information
1 parent
c19f6f2
commit 20c9ff9
Showing
2 changed files
with
74 additions
and
0 deletions.
There are no files selected for viewing
37 changes: 37 additions & 0 deletions
37
testing/web-platform/tests/css/css-conditional/at-media-001.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,37 @@ | ||
| <!doctype html> | ||
| <head> | ||
| <title>CSS Test (Conditional Rules): Support for simple passing conditions in @media</title> | ||
| <link rel="author" title="Elika J. Etemad" href="http://fantasai.inkedblade.net/contact"> | ||
| <link rel="help" href="https://www.w3.org/TR/css-conditional-3/#use"> | ||
| <link rel="help" href="https://www.w3.org/TR/css-conditional-3/#at-media"> | ||
| <link rel="match" href="at-supports-001-ref.html"> | ||
| <meta name="assert" | ||
| content="Test passes if rules under a true @media condition are applied in place."> | ||
| <style> | ||
| div { | ||
| background: red; | ||
| height: 25px; | ||
| width: 100px; | ||
| } | ||
|
|
||
| @media all { | ||
| .test1 { background: green; } | ||
| .test2 { background: red; } | ||
| } | ||
| .test2 { background: green; } | ||
|
|
||
| @media not unknown { | ||
| .test3 { background: green; } | ||
| .test4 { background: red; } | ||
| } | ||
| .test4 { background: green; } | ||
| </style> | ||
| </head> | ||
| <body> | ||
| <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> | ||
| <div class="test1"></div> | ||
| <div class="test2"></div> | ||
| <div class="test3"></div> | ||
| <div class="test4"></div> | ||
| </body> | ||
| </html> |
37 changes: 37 additions & 0 deletions
37
testing/web-platform/tests/css/css-conditional/at-media-002.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,37 @@ | ||
| <!doctype html> | ||
| <head> | ||
| <title>CSS Test (Conditional Rules): Support for simple failing conditions in @media</title> | ||
| <link rel="author" title="Elika J. Etemad" href="http://fantasai.inkedblade.net/contact"> | ||
| <link rel="help" href="https://www.w3.org/TR/css-conditional-3/#use"> | ||
| <link rel="help" href="https://www.w3.org/TR/css-conditional-3/#at-media"> | ||
| <link rel="match" href="at-supports-001-ref.html"> | ||
| <meta name="assert" | ||
| content="Test passes if rules under a false @media condition are not applied."> | ||
| <style> | ||
| div { | ||
| background: green; | ||
| height: 25px; | ||
| width: 100px; | ||
| } | ||
| @media not all { | ||
| .test1 { background: red; } | ||
| } | ||
| @media unknown { | ||
| .test2 { background: red; } | ||
| } | ||
| @media (unknown) { | ||
| .test3 { background: red; } | ||
| } | ||
| @media not (unknown) { | ||
| .test4 { background: red; } | ||
| } | ||
| </style> | ||
| </head> | ||
| <body> | ||
| <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p> | ||
| <div class="test1"></div> | ||
| <div class="test2"></div> | ||
| <div class="test3"></div> | ||
| <div class="test4"></div> | ||
| </body> | ||
| </html> |