Skip to content

Commit

Permalink
Move popover=hint related code out of non-tentative test
Browse files Browse the repository at this point in the history
This refactors the test logic into a shared JS file and splits
the popover=hint test code into a new .tentative.html file.

Per this comment:
web-platform-tests/interop#423 (comment)

Bug: 1416284
Change-Id: Idda2716c476cf3d9b8fea724ece6e48d66e1fb62
  • Loading branch information
mfreed7 authored and chromium-wpt-export-bot committed Nov 29, 2023
1 parent ded643e commit 6ed9f76
Show file tree
Hide file tree
Showing 3 changed files with 143 additions and 123 deletions.
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
<!DOCTYPE html>
<meta charset="utf-8" />
<title>Popover invoking attribute</title>
<link rel="author" href="mailto:masonf@chromium.org">
<link rel=help href="https://open-ui.org/components/popover.research.explainer">
<link rel=help href="https://html.spec.whatwg.org/multipage/popover.html">
<meta name="timeout" content="long">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/resources/testdriver.js"></script>
<script src="/resources/testdriver-actions.js"></script>
<script src="/resources/testdriver-vendor.js"></script>
<script src="resources/popover-utils.js"></script>
<script src="resources/popover-invoking-attribute.js"></script>

<body>
<script>
runPopoverInvokerTests(["hint"]);
</script>
125 changes: 2 additions & 123 deletions html/semantics/popovers/popover-invoking-attribute.html
Original file line number Diff line number Diff line change
Expand Up @@ -11,134 +11,13 @@
<script src="/resources/testdriver-actions.js"></script>
<script src="/resources/testdriver-vendor.js"></script>
<script src="resources/popover-utils.js"></script>
<script src="resources/popover-invoking-attribute.js"></script>

<body>
<script>
const actionReflectionLogic = (action) => {
switch (action?.toLowerCase()) {
case "show": return "show";
case "hide": return "hide";
default: return "toggle";
}
}
const noActivationLogic = (action) => {
return "none";
}
function makeElementWithType(element,type) {
return (test) => {
const el = Object.assign(document.createElement(element),{type});
document.body.appendChild(el);
test.add_cleanup(() => el.remove());
return el;
};
}
const supportedButtonTypes = ['button','reset','submit',''].map(type => {
return {
name: `<button type="${type}">`,
makeElement: makeElementWithType('button',type),
invokeFn: el => {el.focus(); el.click()},
getExpectedLogic: actionReflectionLogic,
};
});
const supportedInputButtonTypes = ['button','reset','submit','image'].map(type => {
return {
name: `<input type="${type}">`,
makeElement: makeElementWithType('input',type),
invokeFn: el => {el.focus(); el.click()},
getExpectedLogic: actionReflectionLogic,
};
});
const unsupportedTypes = ['text','email','password','search','tel','url','checkbox','radio','range','file','color','date','datetime-local','month','time','week','number'].map(type => {
return {
name: `<input type="${type}">`,
makeElement: makeElementWithType('input',type),
invokeFn: (el) => {el.focus();},
getExpectedLogic: noActivationLogic, // None of these support popover invocation
};
});
const invokers = [
...supportedButtonTypes,
...supportedInputButtonTypes,
...unsupportedTypes,
];
const validTypes = popoverHintSupported() ? ["auto","hint","manual"] : ["auto","manual"];
window.addEventListener('load', () => {
validTypes.forEach(type => {
invokers.forEach(testcase => {
["toggle","hide","show","ShOw","garbage",null,undefined].forEach(action => {
[false,true].forEach(use_idl_for_target => {
[false,true].forEach(use_idl_for_action => {
promise_test(async test => {
const popover = Object.assign(document.createElement('div'),{popover: type, id: 'my-popover'});
assert_equals(popover.popover,type,'reflection');
const invoker = testcase.makeElement(test);
if (use_idl_for_target) {
invoker.popoverTargetElement = popover;
assert_equals(invoker.getAttribute('popovertarget'),'','attribute value');
} else {
invoker.setAttribute('popovertarget',popover.id);
}
if (use_idl_for_action) {
invoker.popoverTargetAction = action;
assert_equals(invoker.getAttribute('popovertargetaction'),String(action),'action reflection');
} else {
invoker.setAttribute('popovertargetaction',action);
}
assert_true(!document.getElementById(popover.id));
assert_equals(invoker.popoverTargetElement,null,'targetElement should be null before the popover is in the document');
assert_equals(invoker.popoverTargetAction,actionReflectionLogic(action),'action should be correct immediately');
document.body.appendChild(popover);
test.add_cleanup(() => {popover.remove();});
assert_equals(invoker.popoverTargetElement,popover,'target element should be returned once it\'s in the document');
assert_false(popover.matches(':popover-open'));
await testcase.invokeFn(invoker);
assert_equals(document.activeElement,invoker,'Focus should end up on the invoker');
expectedBehavior = testcase.getExpectedLogic(action);
switch (expectedBehavior) {
case "toggle":
case "show":
assert_true(popover.matches(':popover-open'),'Toggle or show should show the popover');
popover.hidePopover(); // Hide the popover
break;
case "hide":
case "none":
assert_false(popover.matches(':popover-open'),'Hide or none should leave the popover hidden');
break;
default:
assert_unreached();
}
if (expectedBehavior === "none") {
// If no behavior is expected, then there is nothing left to test. Even re-focusing
// a control that has no expected behavior may hide an open popover via light dismiss.
return;
}
assert_false(popover.matches(':popover-open'));
popover.showPopover(); // Show the popover directly
assert_equals(document.activeElement,invoker,'The popover should not shift focus');
assert_true(popover.matches(':popover-open'));
await testcase.invokeFn(invoker);
switch (expectedBehavior) {
case "toggle":
case "hide":
assert_false(popover.matches(':popover-open'),'Toggle or hide should hide the popover');
break;
case "show":
assert_true(popover.matches(':popover-open'),'Show should leave the popover showing');
break;
default:
assert_unreached();
}
},`Test ${testcase.name}, action=${action}, ${use_idl_for_target ? "popoverTarget IDL" : "popovertarget attr"}, ${use_idl_for_action ? "popoverTargetAction IDL" : "popovertargetaction attr"}, with popover=${type}`);
});
});
});
});
});
});
runPopoverInvokerTests(["auto","manual"]);
</script>



<button popovertarget=p1>Toggle Popover 1</button>
<div popover id=p1 style="border: 5px solid red;top: 100px;left: 100px;">This is popover #1</div>

Expand Down
122 changes: 122 additions & 0 deletions html/semantics/popovers/resources/popover-invoking-attribute.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,122 @@
const actionReflectionLogic = (action) => {
switch (action?.toLowerCase()) {
case "show": return "show";
case "hide": return "hide";
default: return "toggle";
}
}
const noActivationLogic = (action) => {
return "none";
}
function makeElementWithType(element,type) {
return (test) => {
const el = Object.assign(document.createElement(element),{type});
document.body.appendChild(el);
test.add_cleanup(() => el.remove());
return el;
};
}
const supportedButtonTypes = ['button','reset','submit',''].map(type => {
return {
name: `<button type="${type}">`,
makeElement: makeElementWithType('button',type),
invokeFn: el => {el.focus(); el.click()},
getExpectedLogic: actionReflectionLogic,
};
});
const supportedInputButtonTypes = ['button','reset','submit','image'].map(type => {
return {
name: `<input type="${type}">`,
makeElement: makeElementWithType('input',type),
invokeFn: el => {el.focus(); el.click()},
getExpectedLogic: actionReflectionLogic,
};
});
const unsupportedTypes = ['text','email','password','search','tel','url','checkbox','radio','range','file','color','date','datetime-local','month','time','week','number'].map(type => {
return {
name: `<input type="${type}">`,
makeElement: makeElementWithType('input',type),
invokeFn: (el) => {el.focus();},
getExpectedLogic: noActivationLogic, // None of these support popover invocation
};
});
const invokers = [
...supportedButtonTypes,
...supportedInputButtonTypes,
...unsupportedTypes,
];
function runPopoverInvokerTests(popoverTypes) {
window.addEventListener('load', () => {
validTypes.forEach(type => {
invokers.forEach(testcase => {
["toggle","hide","show","ShOw","garbage",null,undefined].forEach(action => {
[false,true].forEach(use_idl_for_target => {
[false,true].forEach(use_idl_for_action => {
promise_test(async test => {
const popover = Object.assign(document.createElement('div'),{popover: type, id: 'my-popover'});
assert_equals(popover.popover,type,'reflection');
const invoker = testcase.makeElement(test);
if (use_idl_for_target) {
invoker.popoverTargetElement = popover;
assert_equals(invoker.getAttribute('popovertarget'),'','attribute value');
} else {
invoker.setAttribute('popovertarget',popover.id);
}
if (use_idl_for_action) {
invoker.popoverTargetAction = action;
assert_equals(invoker.getAttribute('popovertargetaction'),String(action),'action reflection');
} else {
invoker.setAttribute('popovertargetaction',action);
}
assert_true(!document.getElementById(popover.id));
assert_equals(invoker.popoverTargetElement,null,'targetElement should be null before the popover is in the document');
assert_equals(invoker.popoverTargetAction,actionReflectionLogic(action),'action should be correct immediately');
document.body.appendChild(popover);
test.add_cleanup(() => {popover.remove();});
assert_equals(invoker.popoverTargetElement,popover,'target element should be returned once it\'s in the document');
assert_false(popover.matches(':popover-open'));
await testcase.invokeFn(invoker);
assert_equals(document.activeElement,invoker,'Focus should end up on the invoker');
expectedBehavior = testcase.getExpectedLogic(action);
switch (expectedBehavior) {
case "toggle":
case "show":
assert_true(popover.matches(':popover-open'),'Toggle or show should show the popover');
popover.hidePopover(); // Hide the popover
break;
case "hide":
case "none":
assert_false(popover.matches(':popover-open'),'Hide or none should leave the popover hidden');
break;
default:
assert_unreached();
}
if (expectedBehavior === "none") {
// If no behavior is expected, then there is nothing left to test. Even re-focusing
// a control that has no expected behavior may hide an open popover via light dismiss.
return;
}
assert_false(popover.matches(':popover-open'));
popover.showPopover(); // Show the popover directly
assert_equals(document.activeElement,invoker,'The popover should not shift focus');
assert_true(popover.matches(':popover-open'));
await testcase.invokeFn(invoker);
switch (expectedBehavior) {
case "toggle":
case "hide":
assert_false(popover.matches(':popover-open'),'Toggle or hide should hide the popover');
break;
case "show":
assert_true(popover.matches(':popover-open'),'Show should leave the popover showing');
break;
default:
assert_unreached();
}
},`Test ${testcase.name}, action=${action}, ${use_idl_for_target ? "popoverTarget IDL" : "popovertarget attr"}, ${use_idl_for_action ? "popoverTargetAction IDL" : "popovertargetaction attr"}, with popover=${type}`);
});
});
});
});
});
});
}

0 comments on commit 6ed9f76

Please sign in to comment.