Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Test browser, minimal-ui, and fullscreen values of the display member #24380

Merged
merged 1 commit into from Jul 2, 2020
Merged

Test browser, minimal-ui, and fullscreen values of the display member #24380

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
35 changes: 35 additions & 0 deletions appmanifest/display-member/display-member-media-feature-browser-manual.html
View file
Open in desktop
@@ -0,0 +1,35 @@
<!DOCTYPE html>
<title>Test "browser" value of display member + media feature</title>
<link rel="help" href="https://w3c.github.io/manifest#display-member" />
<link rel="help" href="https://w3c.github.io/manifest/#dom-displaymodetype-browser" />
<link rel="help" href="https://w3c.github.io/manifest/#the-display-mode-media-feature" />
<link rel="manifest" href="display-member-media-feature-browser.webmanifest" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<h1>Testing support for "browser" value of display member + media feature</h1>
<style>
.fail {
background-color: red;
}

@media all and (display-mode: browser) {
body {
background-color: green;
}
}
</style>
<script>
const browser = matchMedia("(display-mode: browser)");

browser.onchange = () => {
if (browser.matches) {
document.body.classList.remove("fail");
}
}

if (!browser.matches) {
document.body.classList.add("fail");
}
</script>
<p>
To pass, the background color must be green after installing.
</p>
3 changes: 3 additions & 0 deletions appmanifest/display-member/display-member-media-feature-browser.webmanifest
View file
Open in desktop
@@ -0,0 +1,3 @@
{
"display": "browser"
}
0 ...-member-media-feature.webmanifest.headers → ...media-feature-browser.webmanifest.headers
View file
Open in desktop
File renamed without changes.
35 changes: 35 additions & 0 deletions appmanifest/display-member/display-member-media-feature-fullscreen-manual.html
View file
Open in desktop
@@ -0,0 +1,35 @@
<!DOCTYPE html>
<title>Test "fullscreen" value of display member + media feature</title>
<link rel="help" href="https://w3c.github.io/manifest#display-member" />
<link rel="help" href="https://w3c.github.io/manifest/#dom-displaymodetype-fullscreen" />
<link rel="help" href="https://w3c.github.io/manifest/#the-display-mode-media-feature" />
<link rel="manifest" href="display-member-media-feature-fullscreen.webmanifest" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<h1>Testing support for "fullscreen" value of display member + media feature</h1>
<style>
.fail {
background-color: red;
}

@media all and (display-mode: fullscreen) {
body {
background-color: green;
}
}
</style>
<script>
const fullscreen = matchMedia("(display-mode: fullscreen)");

fullscreen.onchange = () => {
if (fullscreen.matches) {
document.body.classList.remove("fail");
}
}

if (!fullscreen.matches) {
document.body.classList.add("fail");
}
</script>
<p>
To pass, the background color must be green after installing.
</p>
3 changes: 3 additions & 0 deletions appmanifest/display-member/display-member-media-feature-fullscreen.webmanifest
View file
Open in desktop
@@ -0,0 +1,3 @@
{
"display": "fullscreen"
}
1 change: 1 addition & 0 deletions appmanifest/display-member/display-member-media-feature-fullscreen.webmanifest.headers
View file
Open in desktop
@@ -0,0 +1 @@
Content-Type: application/manifest+json; charset=utf-8
35 changes: 35 additions & 0 deletions appmanifest/display-member/display-member-media-feature-minimal-ui-manual.html
View file
Open in desktop
@@ -0,0 +1,35 @@
<!DOCTYPE html>
<title>Test "minimal-ui" value of display member + media feature</title>
<link rel="help" href="https://w3c.github.io/manifest#display-member" />
<link rel="help" href="https://w3c.github.io/manifest/#dom-displaymodetype-minimal-ui" />
<link rel="help" href="https://w3c.github.io/manifest/#the-display-mode-media-feature" />
<link rel="manifest" href="display-member-media-feature-minimal-ui.webmanifest" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<h1>Testing support for "minimal-ui" value of display member + media feature</h1>
<style>
.fail {
background-color: red;
}

@media all and (display-mode: minimal-ui) {
body {
background-color: green;
}
}
</style>
<script>
const minimalUi = matchMedia("(display-mode: minimal-ui)");

minimalUi.onchange = () => {
if (minimalUi.matches) {
document.body.classList.remove("fail");
}
}

if (!minimalUi.matches) {
document.body.classList.add("fail");
}
</script>
<p>
To pass, the background color must be green after installing.
</p>
3 changes: 3 additions & 0 deletions appmanifest/display-member/display-member-media-feature-minimal-ui.webmanifest
View file
Open in desktop
@@ -0,0 +1,3 @@
{
"display": "minimal-ui"
}
1 change: 1 addition & 0 deletions appmanifest/display-member/display-member-media-feature-minimal-ui.webmanifest.headers
View file
Open in desktop
@@ -0,0 +1 @@
Content-Type: application/manifest+json; charset=utf-8
7 changes: 4 additions & 3 deletions .../display-member-media-feature-manual.html → ...mber-media-feature-standalone-manual.html
View file
Open in desktop
@@ -1,10 +1,11 @@
<!DOCTYPE html>
<title>Test that display member plus media feature is supported</title>
<title>Test "standalone" value of display member + media feature</title>
<link rel="help" href="https://w3c.github.io/manifest#display-member" />
<link rel="help" href="https://w3c.github.io/manifest/#the-display-mode-media-feature" />
<link rel="manifest" href="display-member-media-feature.webmanifest" />
<link rel="help" href="https://w3c.github.io/manifest/#dom-displaymodetype-standalone" />
<link rel="manifest" href="display-member-media-feature-standalone.webmanifest" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<h1>Testing support for display member plus media feature</h1>
<h1>Testing support for "standalone" value of display member + media feature</h1>
<style>
.fail {
background-color: red;
Expand Down
0 .../display-member-media-feature.webmanifest → ...mber-media-feature-standalone.webmanifest
View file
Open in desktop
File renamed without changes.
1 change: 1 addition & 0 deletions appmanifest/display-member/display-member-media-feature-standalone.webmanifest.headers
View file
Open in desktop
@@ -0,0 +1 @@
Content-Type: application/manifest+json; charset=utf-8