diff options
Diffstat (limited to 'testing/web-platform/tests/html/rendering/non-replaced-elements/the-fieldset-and-legend-elements/legend-block-position-centering.html')
-rw-r--r-- | testing/web-platform/tests/html/rendering/non-replaced-elements/the-fieldset-and-legend-elements/legend-block-position-centering.html | 58 |
1 files changed, 58 insertions, 0 deletions
diff --git a/testing/web-platform/tests/html/rendering/non-replaced-elements/the-fieldset-and-legend-elements/legend-block-position-centering.html b/testing/web-platform/tests/html/rendering/non-replaced-elements/the-fieldset-and-legend-elements/legend-block-position-centering.html new file mode 100644 index 0000000000..a4eda6e3ef --- /dev/null +++ b/testing/web-platform/tests/html/rendering/non-replaced-elements/the-fieldset-and-legend-elements/legend-block-position-centering.html @@ -0,0 +1,58 @@ +<!DOCTYPE html> +<link rel="help" href="https://html.spec.whatwg.org/C/#the-fieldset-and-legend-elements"> +<!-- A test for the following paragraph: +The element is expected to be positioned in the block-flow direction such that +its border box is centered over the border on the block-start side of the +fieldset element. +--> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<style> +fieldset { + margin: 0; + padding: 0; + border: 100px solid black; +} +legend { + height: 0px; + border-color: yellow; + border-style: solid; +} +</style> +<fieldset> +<legend style="border-width:50px"></legend> +<br> +</fieldset> +<br> + +<fieldset> +<legend style="border-width:25px 50px"></legend> +<br> +</fieldset> +<br> + +<fieldset> +<legend style="border-width:10px 50px 40px 50px"></legend> +<br> +</fieldset> +<br> + +<fieldset> +<legend style="border-width:40px 50px 10px 50px"></legend> +<br> +</fieldset> + +<script> +function legendBlockOffset(fieldset) { + let legend = fieldset.querySelector('legend'); + return legend.getBoundingClientRect().y - fieldset.getBoundingClientRect().y; +} + +test(() => { + let fieldsets = document.querySelectorAll('fieldset'); + assert_equals(legendBlockOffset(fieldsets[0]), 0); + assert_equals(legendBlockOffset(fieldsets[1]), 25); + assert_equals(legendBlockOffset(fieldsets[2]), 25); + assert_equals(legendBlockOffset(fieldsets[3]), 25); +}, 'Legend\'s border-box should be centere on the fieldset border'); +</script> |