mirror of
https://github.com/mozilla/gecko-dev.git
synced 2025-11-11 21:58:41 +02:00
c016e21c54
In particular: - In contain-layout-suppress-baseline-002.html, the test currently indirectly relies on the 50px-tall-canvas being the tallest thing in each flex container. This isn't robustly true (and in fact on windows, the textarea is taller at 50.8px tall). So I'm adjusting this test so that it no longer has a hardcoded flex container size and no longer depends on this. - In contain-layout-baseline-005.html and its reference case, we need to explicitly specify 'vertical-align:baseline' to test baseline-alignment, because some of its tested form controls have other UA-stylesheet-provided default values of 'vertical-align'. (e.g. <select multiple> defaults to 'vertical-align:text-bottom") - Also: in that same test, we need to reduce the width of the an <input> textfield -- otherwise, it and the other elements on its line may not fit and may linewrap, which prevents us from effectively testing baseline-alignment on the linewrapped element. - In contain-layout-button-001.html, the expectation was not correct. Before this patch, the test expects that a layout-contained button will have the same baseline as an empty button, and that's an invalid expectation. An empty button uses a point inside of its content-box as its baseline, whereas a layout-contained element *has no baseline*, which means that it does 'vertical-align:baseline' alignment by aligning its own margin-bottom edge with the parent's baseline, per https://drafts.csswg.org/css2/visudet.html#propdef-vertical-align So, I'm amending the test to have this expectation and updating its meta tags to reference the updated expectation and with a reference to that spec text. Firefox fails the amended contain-layout-button-001.html test, so this patch adds a .ini file to reflect that failure. The next patch in this series will fix our implementation to make us pass the test, and will remove the .ini file. Chrome also fails the amended contain-layout-button-001.html tests, and I filed https://bugs.chromium.org/p/chromium/issues/detail?id=965740 on them with an explanation. Differential Revision: https://phabricator.services.mozilla.com/D32182 --HG-- extra : moz-landing-system : lando
21 lines
722 B
HTML
21 lines
722 B
HTML
<!DOCTYPE html>
|
|
<meta charset="utf-8">
|
|
<title>CSS Containment Test: Reference file</title>
|
|
<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
|
|
<style>
|
|
div.fakeButton {
|
|
display: inline-block;
|
|
border: 5px solid green;
|
|
padding: 0;
|
|
margin-bottom: 2px;
|
|
color: transparent;
|
|
width: 0;
|
|
height: 0px;
|
|
/* Layout containment creates a stacking context, the following lines simuluate the same in the reference file. */
|
|
position: relative;
|
|
z-index: 1;
|
|
}
|
|
</style>
|
|
|
|
<p>This test passes if it has the same output as the reference. You see the word "before", a 10px green square aligned 2px above the text's baseline, and then the word "after".</p>
|
|
before<div class="fakeButton"></div>after
|