Bug 1566163 [wpt PR 17840] - Set toast default styling, a=testonly

Automatic update from web-platform-tests
Set toast default styling

Updated the styling to reflect the changes to the
explainer in PR
https://github.com/jackbsteinberg/std-toast/pull/44

BUG=972945

Change-Id: I5e89886712b2b5704555352c4f25fe2348441e11
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1702124
Reviewed-by: Kent Tamura <tkent@chromium.org>
Commit-Queue: Jack Steinberg <jacksteinberg@chromium.org>
Cr-Commit-Position: refs/heads/master@{#678032}

--

wpt-commits: b4b6c5833f861786f90629463aa7b98382cb2ff7
wpt-pr: 17840
This commit is contained in:
Jack Steinberg 2019-07-22 11:10:01 +00:00 коммит произвёл James Graham
Родитель 94de10fa0c
Коммит a0feb637d0
2 изменённых файлов: 78 добавлений и 0 удалений

Просмотреть файл

@ -70,6 +70,20 @@ export const assertActionButtonOnToast = (action, toast) => {
assert_equals(action, toast.querySelector('button'));
};
export const assertComputedStyleMapsEqual = (element1, element2) => {
assert_greater_than(element1.computedStyleMap().size, 0);
for (const [styleProperty, baseStyleValues] of element1.computedStyleMap()) {
const refStyleValues = element2.computedStyleMap().getAll(styleProperty);
assert_equals(baseStyleValues.length, refStyleValues.length, `${styleProperty} length`);
for (let i = 0; i < baseStyleValues.length; ++i) {
const baseStyleValue = baseStyleValues[i];
const refStyleValue = refStyleValues[i];
assert_equals(baseStyleValue.toString(), refStyleValue.toString(), `diff at value ${styleProperty}`);
}
}
}
export class EventCollector {
events = [];

Просмотреть файл

@ -0,0 +1,64 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>Toast: style tests</title>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<main>
</main>
<script type="module">
import { testToastElement, assertComputedStyleMapsEqual } from './resources/helpers.js';
testToastElement((toast) => {
toast.open = true;
const mockToast = document.createElement('span');
mockToast.id = 'mock-toast-open';
mockToast.textContent = 'Message';
const mockStyler = document.createElement('style');
mockStyler.textContent = `
#mock-toast-open {
position: fixed;
bottom: 1em;
right: 1em;
border: solid;
padding: 1em;
background: white;
color: black;
z-index: 1;
}`;
document.querySelector('main').appendChild(mockStyler);
document.querySelector('main').appendChild(mockToast);
assertComputedStyleMapsEqual(toast, mockToast);
}, 'the computed style map of an open unstyled toast is the same as a span given toast defaults');
testToastElement((toast) => {
const mockToast = document.createElement('span');
mockToast.id = 'mock-toast-hidden';
mockToast.textContent = 'Message';
const mockStyler = document.createElement('style');
mockStyler.textContent = `
#mock-toast-hidden {
position: fixed;
bottom: 1em;
right: 1em;
border: solid;
padding: 1em;
background: white;
color: black;
z-index: 1;
display: none;
}`;
document.querySelector('main').appendChild(mockStyler);
document.querySelector('main').appendChild(mockToast);
assertComputedStyleMapsEqual(toast, mockToast);
}, 'the computed style map of a closed unstyled toast is the same as a span given toast defaults');
</script>