popovertarget-reflection.html (2962B)
1 <!DOCTYPE html> 2 <link rel=author href="mailto:jarhar@chromium.org"> 3 <link rel=help href="https://bugs.chromium.org/p/chromium/issues/detail?id=1523410"> 4 <link rel=help href="https://bugzilla.mozilla.org/show_bug.cgi?id=1879001"> 5 <link rel=help href="https://html.spec.whatwg.org/multipage/common-dom-interfaces.html#reflecting-content-attributes-in-idl-attributes:element"> 6 <script src="/resources/testharness.js"></script> 7 <script src="/resources/testharnessreport.js"></script> 8 9 <button id=mybutton popovertarget="mypopover">toggle popover</button> 10 <div id=mypopover popover=auto>popover</div> 11 12 <script> 13 test(() => { 14 assert_equals(mybutton.popoverTargetElement.id, "mypopover", 15 'Setting element.popoverTargetElement to a valid element should work'); 16 17 mybutton.popoverTargetElement = null; 18 assert_false(mybutton.hasAttribute('popovertarget'), 19 'Setting element.popoverTargetElement to null should unset popovertarget attribute.'); 20 assert_equals(mybutton.popoverTargetElement, null, 21 'Setting element.popoverTargetElement to null should remove the existing element from element.popoverTargetElement.'); 22 23 mybutton.popoverTargetElement = mypopover; 24 assert_true(mybutton.hasAttribute('popovertarget'), 25 'Assigning to element.popoverTargetElement should set the popovertarget attribute.'); 26 27 mybutton.removeAttribute('popovertarget'); 28 assert_equals(mybutton.popoverTargetElement, null, 29 'Removing the popovertarget attribute should remove the element from element.popoverTargetElement.'); 30 31 mybutton.popoverTargetElement = mypopover; 32 assert_true(mybutton.hasAttribute('popovertarget'), 33 'Assigning to element.popoverTargetElement should set the popovertarget attribute.'); 34 35 mybutton.setAttribute("popovertarget", 'invalid'); 36 assert_equals(mybutton.popoverTargetElement, null, 37 'Setting the popovertarget attribute to a localName that is not attr should remove the existing element from element.popoverTargetElement.'); 38 39 mybutton.popoverTargetElement = mypopover; 40 mybutton.setAttribute("popovertarget", ""); 41 assert_equals(mybutton.popoverTargetElement, null, 42 'Setting the popovertarget attribute to empty string right after setting explicit element does remove the explicit element.'); 43 44 mybutton.setAttribute("popovertarget", "mypopover"); 45 assert_equals(mybutton.popoverTargetElement.id, "mypopover", 46 'Setting the popovertarget attribute to a value should set the popover target element.'); 47 mybutton.setAttribute("popovertarget", ""); 48 assert_equals(mybutton.getAttribute('popovertarget'), "", 49 'Assigning to element.popoverTargetElement to empty string should update the attribute value to empty string.'); 50 assert_equals(mybutton.popoverTargetElement, null, 51 'Setting the popovertarget attribute to empty string should remove the existing element from element.popoverTargetElement.'); 52 }, 'Element attribute reflection of popoverTargetElement/popovertarget should be kept in sync.'); 53 </script>