From bd3b497e7b4058aed573a6b4a88106fec55d5138 Mon Sep 17 00:00:00 2001 From: Simon Pieters Date: Fri, 11 Jan 2019 21:35:36 +0100 Subject: [PATCH] HTML: Tests for button layout (WIP) Follows https://github.com/whatwg/html/pull/4143. (More tests will be added to this PR.) Test grid/inline-grid on button Test flex/inline-flex on button Test inline-level (except ruby) Test other display values on button Add a clarifying comment Test non-auto left/right on abspos button Test that buttons shrink-wrap Test propagation of text-decoration into buttons Test aspects of the anonymous button content box --- .../form-controls/button-style.html | 20 +++++++ .../widgets/button-layout/abspos.html | 31 +++++++++++ .../anonymous-button-content-box-ref.html | 31 +++++++++++ .../anonymous-button-content-box.html | 31 +++++++++++ .../widgets/button-layout/computed-style.html | 31 +++++++++++ .../widgets/button-layout/display-other.html | 52 +++++++++++++++++++ .../rendering/widgets/button-layout/flex.html | 29 +++++++++++ .../rendering/widgets/button-layout/grid.html | 30 +++++++++++ .../button-layout/inline-level-ref.html | 10 ++++ .../widgets/button-layout/inline-level.html | 25 +++++++++ .../propagate-text-decoration-ref.html | 9 ++++ .../propagate-text-decoration.html | 12 +++++ .../widgets/button-layout/shrink-wrap.html | 42 +++++++++++++++ 13 files changed, 353 insertions(+) create mode 100644 html/rendering/non-replaced-elements/form-controls/button-style.html create mode 100644 html/rendering/widgets/button-layout/abspos.html create mode 100644 html/rendering/widgets/button-layout/anonymous-button-content-box-ref.html create mode 100644 html/rendering/widgets/button-layout/anonymous-button-content-box.html create mode 100644 html/rendering/widgets/button-layout/computed-style.html create mode 100644 html/rendering/widgets/button-layout/display-other.html create mode 100644 html/rendering/widgets/button-layout/flex.html create mode 100644 html/rendering/widgets/button-layout/grid.html create mode 100644 html/rendering/widgets/button-layout/inline-level-ref.html create mode 100644 html/rendering/widgets/button-layout/inline-level.html create mode 100644 html/rendering/widgets/button-layout/propagate-text-decoration-ref.html create mode 100644 html/rendering/widgets/button-layout/propagate-text-decoration.html create mode 100644 html/rendering/widgets/button-layout/shrink-wrap.html diff --git a/html/rendering/non-replaced-elements/form-controls/button-style.html b/html/rendering/non-replaced-elements/form-controls/button-style.html new file mode 100644 index 00000000000000..2d23b4a77d716b --- /dev/null +++ b/html/rendering/non-replaced-elements/form-controls/button-style.html @@ -0,0 +1,20 @@ + +default style on buttons + + +
+ + + + + +
+ \ No newline at end of file diff --git a/html/rendering/widgets/button-layout/abspos.html b/html/rendering/widgets/button-layout/abspos.html new file mode 100644 index 00000000000000..c3089b1e39749e --- /dev/null +++ b/html/rendering/widgets/button-layout/abspos.html @@ -0,0 +1,31 @@ + +abspos button with auto width, non-auto left/right + + + + + + + + + + + diff --git a/html/rendering/widgets/button-layout/anonymous-button-content-box-ref.html b/html/rendering/widgets/button-layout/anonymous-button-content-box-ref.html new file mode 100644 index 00000000000000..243f0add0deb14 --- /dev/null +++ b/html/rendering/widgets/button-layout/anonymous-button-content-box-ref.html @@ -0,0 +1,31 @@ + +Reference for Anonymous button content box + +
+
input
+
input grid
+
input flex
+
button
+
+
+
button left
+
div
+
grid
+
grid
+
+
+
flex
+
flex
+
tall
+
wide
+
diff --git a/html/rendering/widgets/button-layout/anonymous-button-content-box.html b/html/rendering/widgets/button-layout/anonymous-button-content-box.html new file mode 100644 index 00000000000000..07c7b8e366f076 --- /dev/null +++ b/html/rendering/widgets/button-layout/anonymous-button-content-box.html @@ -0,0 +1,31 @@ + +Anonymous button content box + + +
+ + + + +
+
+ + + + +
+
+ + + + +
diff --git a/html/rendering/widgets/button-layout/computed-style.html b/html/rendering/widgets/button-layout/computed-style.html new file mode 100644 index 00000000000000..696b551bae37c5 --- /dev/null +++ b/html/rendering/widgets/button-layout/computed-style.html @@ -0,0 +1,31 @@ + +computed style on buttons + + +
+ + + + + +
+ \ No newline at end of file diff --git a/html/rendering/widgets/button-layout/display-other.html b/html/rendering/widgets/button-layout/display-other.html new file mode 100644 index 00000000000000..6ed3f5894a75d5 --- /dev/null +++ b/html/rendering/widgets/button-layout/display-other.html @@ -0,0 +1,52 @@ + +button with other display values + + + +
+after + diff --git a/html/rendering/widgets/button-layout/flex.html b/html/rendering/widgets/button-layout/flex.html new file mode 100644 index 00000000000000..ce845eb2b49854 --- /dev/null +++ b/html/rendering/widgets/button-layout/flex.html @@ -0,0 +1,29 @@ + +button with flex/inline-flex + + + + + + + diff --git a/html/rendering/widgets/button-layout/grid.html b/html/rendering/widgets/button-layout/grid.html new file mode 100644 index 00000000000000..7c2a46709934ee --- /dev/null +++ b/html/rendering/widgets/button-layout/grid.html @@ -0,0 +1,30 @@ + +button with grid/inline-grid + + + + + + + diff --git a/html/rendering/widgets/button-layout/inline-level-ref.html b/html/rendering/widgets/button-layout/inline-level-ref.html new file mode 100644 index 00000000000000..3784cc30dbee61 --- /dev/null +++ b/html/rendering/widgets/button-layout/inline-level-ref.html @@ -0,0 +1,10 @@ + +Reference for button with inline-level display + +

There should be three buttons below containing "1" and "2" on separate lines, and "a" and "b" before and after on the same baseline as the "2".

+

ab

+

ab

+

ab

+

ab

diff --git a/html/rendering/widgets/button-layout/inline-level.html b/html/rendering/widgets/button-layout/inline-level.html new file mode 100644 index 00000000000000..e23aba731ce2ff --- /dev/null +++ b/html/rendering/widgets/button-layout/inline-level.html @@ -0,0 +1,25 @@ + +button with inline-level display + + +

There should be three buttons below containing "1" and "2" on separate lines, and "a" and "b" before and after on the same baseline as the "2".

+

ab

+

ab

+

ab

+

ab

+ diff --git a/html/rendering/widgets/button-layout/propagate-text-decoration-ref.html b/html/rendering/widgets/button-layout/propagate-text-decoration-ref.html new file mode 100644 index 00000000000000..f33a011a2040e3 --- /dev/null +++ b/html/rendering/widgets/button-layout/propagate-text-decoration-ref.html @@ -0,0 +1,9 @@ + +Reference for propagating text-decoration into buttons + +

The text in the following buttons should be underlined.

+

+

The text in the following buttons should NOT be underlined.

+

diff --git a/html/rendering/widgets/button-layout/propagate-text-decoration.html b/html/rendering/widgets/button-layout/propagate-text-decoration.html new file mode 100644 index 00000000000000..9bdbbef0c274fd --- /dev/null +++ b/html/rendering/widgets/button-layout/propagate-text-decoration.html @@ -0,0 +1,12 @@ + +propagating text-decoration into buttons + + +

The text in the following buttons should be underlined.

+

+

The text in the following buttons should NOT be underlined.

+

diff --git a/html/rendering/widgets/button-layout/shrink-wrap.html b/html/rendering/widgets/button-layout/shrink-wrap.html new file mode 100644 index 00000000000000..6d61102608c0df --- /dev/null +++ b/html/rendering/widgets/button-layout/shrink-wrap.html @@ -0,0 +1,42 @@ + +shrink-wrap button + + + + + + +
+ +
+ +
+ +
+ +
+ +
+ +