Skip to content

Commit

Permalink
[css-ui][compat] Move and update appearance cssom test
Browse files Browse the repository at this point in the history
  • Loading branch information
@zcorpan
zcorpan committed Jan 23, 2019
1 parent ad7a8f6 commit e188b4d
Show file tree
Hide file tree
Showing 2 changed files with 233 additions and 57 deletions.
57 changes: 0 additions & 57 deletions compat/webkit-appearance.html
View file

This file was deleted.

233 changes: 233 additions & 0 deletions css/css-ui/appearance-cssom-001.html
View file
@@ -0,0 +1,233 @@
<!doctype html>
<title>CSS Basic User Interface Test: appearance CSSOM</title>
<link rel="help" href="https://drafts.csswg.org/css-ui-4/#appearance-switching">
<meta name="assert" content="CSSOM for the appearance/-webkit-appearance property is correct.">
<script src=/resources/testharness.js></script>
<script src=/resources/testharnessreport.js></script>
<button id=button>Test</button>
<script>
const button = document.getElementById('button');
const values = ["none",
"auto",
"button",
"button-bevel",
"caret",
"checkbox",
"listbox",
"listitem",
"menulist",
"menulist-button",
"menulist-text",
"menulist-textfield",
"meter",
"progress-bar",
"push-button",
"radio",
"searchfield",
"slider-horizontal",
"square-button",
"textarea",
"textfield",
];
function assert_style_for_prop(style, prop, value) {
if (prop === '-webkit-appearance') {
assert_equals(style.WebkitAppearance, value, 'style.WebkitAppearance (uppercase W)');
assert_equals(style.webkitAppearance, value, 'style.webkitAppearance (lowercase w)');
} else {
assert_equals(style.appearance, value, 'style.appearance');
}
assert_equals(style.getPropertyValue(prop), value, `getPropertyValue(${prop})`);
}
for (const prop of ["-webkit-appearance", "appearance"]) {
for (const value of values) {
test(() => {
button.removeAttribute('style');
button.style.setProperty(prop, value);
assert_style_for_prop(button.style, prop, value);
const style = getComputedStyle(button);
assert_style_for_prop(style, prop, value);
}, `${prop}: ${value}`);
}

const invalidValues = ["bogus-button",
"attachment",
"borderless-attachment",
"button-arrow-down",
"button-arrow-next",
"button-arrow-previous",
"button-arrow-up",
"button-focus",
"caps-lock-indicator",
"checkbox-container",
"checkbox-label",
"checkmenuitem",
"color-well",
"continuous-capacity-level-indicator",
"default-button",
"discrete-capacity-level-indicator",
"dualbutton",
"groupbox",
"inner-spin-button",
"image-controls-button",
"list-button",
"listitem",
"media-enter-fullscreen-button",
"media-exit-fullscreen-button",
"media-fullscreen-volume-slider",
"media-fullscreen-volume-slider-thumb",
"media-mute-button",
"media-play-button",
"media-overlay-play-button",
"media-return-to-realtime-button",
"media-rewind-button",
"media-seek-back-button",
"media-seek-forward-button",
"media-toggle-closed-captions-button",
"media-slider",
"media-sliderthumb",
"media-volume-slider-container",
"media-volume-slider-mute-button",
"media-volume-slider",
"media-volume-sliderthumb",
"media-controls-background",
"media-controls-dark-bar-background",
"media-controls-fullscreen-background",
"media-controls-light-bar-background",
"media-current-time-display",
"media-time-remaining-display",
"menuarrow",
"menubar",
"menucheckbox",
"menuimage",
"menuitem",
"menuitemtext",
"menupopup",
"menuradio",
"menuseparator",
"meterbar",
"meterchunk",
"number-input",
"progress-bar-value",
"progressbar",
"progressbar-vertical",
"progresschunk",
"progresschunk-vertical",
"radio-container",
"radio-label",
"radiomenuitem",
"range",
"range-thumb",
"rating-level-indicator",
"resizer",
"resizerpanel",
"scale-horizontal",
"scalethumbend",
"scalethumb-horizontal",
"scalethumbstart",
"scalethumbtick",
"scalethumb-vertical",
"scale-vertical",
"scrollbarbutton-down",
"scrollbarbutton-left",
"scrollbarbutton-right",
"scrollbarbutton-up",
"scrollbarthumb-horizontal",
"scrollbarthumb-vertical",
"scrollbartrack-horizontal",
"scrollbartrack-vertical",
"searchfield-decoration",
"searchfield-results-decoration",
"searchfield-results-button",
"searchfield-cancel-button",
"snapshotted-plugin-overlay",
"separator",
"sheet",
"slider-vertical",
"sliderthumb-horizontal",
"sliderthumb-vertical",
"spinner",
"spinner-downbutton",
"spinner-textfield",
"spinner-upbutton",
"splitter",
"statusbar",
"statusbarpanel",
"tab",
"tabpanel",
"tabpanels",
"tab-scroll-arrow-back",
"tab-scroll-arrow-forward ",
"textfield-multiline",
"toolbar",
"toolbarbutton",
"toolbarbutton-dropdown",
"toolbargripper",
"toolbox",
"tooltip",
"treeheader",
"treeheadercell",
"treeheadersortarrow",
"treeitem",
"treeline",
"treetwisty",
"treetwistyopen",
"treeview",
"relevancy-level-indicator",
"-moz-win-borderless-glass",
"-moz-win-browsertabbar-toolbox",
"-moz-win-communicationstext",
"-moz-win-communications-toolbox",
"-moz-win-exclude-glass",
"-moz-win-glass",
"-moz-win-media-toolbox",
"-moz-window-button-box",
"-moz-window-button-box-maximized",
"-moz-window-button-close",
"-moz-window-button-maximize",
"-moz-window-button-minimize",
"-moz-window-button-restore",
"-moz-window-frame-bottom",
"-moz-window-frame-left",
"-moz-window-frame-right",
"-moz-window-titlebar",
"-moz-window-titlebar-maximized",
"-apple-pay-button",
];
for (const invalidValue of invalidValues) {
test(() => {
button.removeAttribute('style');
button.style.setProperty(prop, invalidValue);
assert_style_for_prop(button.style, prop, "");
const style = getComputedStyle(button);
assert_style_for_prop(style, prop, "button");
}, `${prop}: ${invalidValue} (invalid)`);
}
}

for (const prefix of ["-ms-",
"mso-",
"-moz-",
"-o-",
"-xv-",
"-atsc-",
"-wap-",
"-khtml-",
"-konq-",
"-apple-",
"prince-",
"-ah-",
"-hp-",
"-ro-",
"-rim-",
"-tc-",
]) {
const prop = `${prefix}appearance`;
test(() => {
button.removeAttribute('style');
button.style.setProperty(prop, 'none');
assert_equals(button.style.getPropertyValue(prop), '');
const style = getComputedStyle(button);
assert_equals(style.getPropertyValue(prop), '');
}, `${prop} (should not be supported)`);
}
</script>

0 comments on commit e188b4d

Please sign in to comment.