css: Improve test coverage

Among other things, this includes a test for the fix
in the previous commit.

testsuite/css/style/font.css

@@ -8,16 +8,36 @@ box {
 
 #label2 {
   font: 10pt Cantarell, sans-serif;
+  line-height: normal;
 }
 
 #label3 {
   font: bold italic 80% monospace;
+  line-height: 1.5;
 }
 
 #label4 {
   font: expanded oblique xx-small serif;
+  font-variant-caps: normal;
+  font-variant-numeric: normal;
+  font-variant-alternates: normal;
+  font-variant-position: normal;
+  font-variation-settings: normal;
+  font-feature-settings: normal;
+  font-kerning: normal;
+  font-size: 10px;
+  line-height: 12px;
 }
 
 #label5 {
   font: 20mm '21st Century';
+  font-variant-caps: unicase;
+  font-variant-numeric: tabular-nums diagonal-fractions;
+  font-variant-alternates: historical-forms;
+  font-variant-position: super;
+  font-variation-settings: 'wght' 300, 'slnt' 1;
+  font-feature-settings: 'liga' on, 'dlig' off, 'ss01' 1, 'tnum' 0;
+  font-kerning: auto;
+  font-size: larger;
+  line-height: 120%;
 }

testsuite/css/style/font.nodes

@@ -16,24 +16,40 @@ window.background:dir(ltr)
       font-weight: 400; /* font.css:10:3-36 */
       font-stretch: normal; /* font.css:10:3-36 */
       font-variant-caps: normal; /* font.css:10:3-36 */
+      line-height: normal; /* font.css:11:3-23 */
     label#label3:dir(ltr)
-      font-size: 8px; /* font.css:14:3-35 */
+      font-size: 8px; /* font.css:15:3-35 */
-      font-family: "monospace"; /* font.css:14:3-35 */
+      font-family: "monospace"; /* font.css:15:3-35 */
-      font-style: italic; /* font.css:14:3-35 */
+      font-style: italic; /* font.css:15:3-35 */
-      font-weight: 700; /* font.css:14:3-35 */
+      font-weight: 700; /* font.css:15:3-35 */
-      font-stretch: normal; /* font.css:14:3-35 */
+      font-stretch: normal; /* font.css:15:3-35 */
-      font-variant-caps: normal; /* font.css:14:3-35 */
+      font-variant-caps: normal; /* font.css:15:3-35 */
+      line-height: 1.5; /* font.css:16:3-20 */
     label#label4:dir(ltr)
-      font-size: 8px; /* font.css:18:3-41 */
+      font-size: 10px; /* font.css:28:3-19 */
-      font-family: "serif"; /* font.css:18:3-41 */
+      font-family: "serif"; /* font.css:20:3-41 */
-      font-style: oblique; /* font.css:18:3-41 */
+      font-style: oblique; /* font.css:20:3-41 */
-      font-weight: 400; /* font.css:18:3-41 */
+      font-weight: 400; /* font.css:20:3-41 */
-      font-stretch: expanded; /* font.css:18:3-41 */
+      font-stretch: expanded; /* font.css:20:3-41 */
-      font-variant-caps: normal; /* font.css:18:3-41 */
+      font-kerning: normal; /* font.css:27:3-24 */
+      font-variant-position: normal; /* font.css:24:3-33 */
+      font-variant-caps: normal; /* font.css:21:3-29 */
+      font-variant-numeric: normal; /* font.css:22:3-32 */
+      font-variant-alternates: normal; /* font.css:23:3-35 */
+      font-feature-settings: normal; /* font.css:26:3-33 */
+      font-variation-settings: normal; /* font.css:25:3-35 */
+      line-height: 12px; /* font.css:29:3-21 */
     label#label5:dir(ltr)
-      font-size: 75.590551181102356px; /* font.css:22:3-29 */
+      font-size: 12px; /* font.css:41:3-21 */
-      font-family: "21st Century"; /* font.css:22:3-29 */
+      font-family: "21st Century"; /* font.css:33:3-29 */
-      font-style: normal; /* font.css:22:3-29 */
+      font-style: normal; /* font.css:33:3-29 */
-      font-weight: 400; /* font.css:22:3-29 */
+      font-weight: 400; /* font.css:33:3-29 */
-      font-stretch: normal; /* font.css:22:3-29 */
+      font-stretch: normal; /* font.css:33:3-29 */
-      font-variant-caps: normal; /* font.css:22:3-29 */
+      font-kerning: auto; /* font.css:40:3-22 */
+      font-variant-position: super; /* font.css:37:3-32 */
+      font-variant-caps: unicase; /* font.css:34:3-30 */
+      font-variant-numeric: tabular-nums diagonal-fractions; /* font.css:35:3-57 */
+      font-variant-alternates: historical-forms; /* font.css:36:3-45 */
+      font-feature-settings: "dlig" 0, "tnum" 0, "liga" 1, "ss01" 1; /* font.css:39:3-68 */
+      font-variation-settings: "slnt" 1, "wght" 300; /* font.css:38:3-49 */
+      line-height: 14.399999999999999px; /* font.css:42:3-21 */

testsuite/css/style/gradient.css

@@ -9,3 +9,7 @@ box {
 label {
   background-image: radial-gradient(farthest-corner at 50% 30px, yellow, red 30%, blue);
 }
+
+image {
+  background-image: conic-gradient(from 25deg at 50% 30px, yellow, red 30%, blue);
+}

testsuite/css/style/gradient.nodes

@@ -6,3 +6,5 @@ window.background:dir(ltr)
 
     label:dir(ltr)
       background-image: radial-gradient(ellipse farthest-corner at center 30px, rgb(255,255,0), rgb(255,0,0) 30%, rgb(0,0,255)); /* gradient.css:10:3-89 */
+    image:dir(ltr)
+      background-image: self-gradient(from center 30px at 25deg, rgb(255,255,0), rgb(255,0,0) 30%, rgb(0,0,255)); /* gradient.css:14:3-83 */

testsuite/css/style/gradient.ui

@@ -11,6 +11,11 @@
             <property name="visible">1</property>
           </object>
         </child>
+        <child>
+          <object class="GtkImage">
+            <property name="visible">1</property>
+          </object>
+        </child>
       </object>
     </child>
   </object>

testsuite/css/style/meson.build

@@ -59,6 +59,9 @@ test_data = [
   'label.css',
   'label.nodes',
   'label.ui',
+  'misc.css',
+  'misc.nodes',
+  'misc.ui',
   'nth-child.css',
   'nth-child.nodes',
   'nth-child.ui',

testsuite/css/style/misc.css

@@ -0,0 +1,21 @@
+box {
+  -gtk-icon-palette: default;
+  -gtk-icon-transform:  none;
+}
+
+label {
+  -gtk-icon-palette: error #ffaabb, warning yellow, blue #0000bb;
+  -gtk-icon-transform: scale3d(1,2,3) skew(20deg,1rad) perspective(100cm)
+                       matrix3d(0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15);
+}
+
+image {
+  -gtk-icon-transform: matrix(1,0, 0, 1.0, 1.5, 2.3) translate(20px) scale(1, 2.4)
+                       rotate3d(1, 2, 3, 25deg);
+}
+
+picture {
+  -gtk-icon-transform: translate3d(1px, 2px, 3px) scaleX(1.0) scaleY(2.0) scaleZ(3.0)
+                       skewX(20deg) skewY(-10deg) translateX(1px) translateY(2px)
+                       translateZ(3px);
+}

testsuite/css/style/misc.nodes

@@ -0,0 +1,12 @@
+window.background:dir(ltr)
+  box.horizontal:dir(ltr)
+    -gtk-icon-palette: error rgb(255,255,255), success rgb(255,255,255), warning rgb(255,255,255); /* misc.css:2:3-30 */
+    -gtk-icon-transform: none; /* misc.css:3:3-30 */
+
+    label:dir(ltr)
+      -gtk-icon-palette: blue rgb(0,0,187), error rgb(255,170,187), warning rgb(255,255,0); /* misc.css:7:3-66 */
+      -gtk-icon-transform: scale3d(1, 2, 3) skew(20deg, 57.295779513082323deg) perspective(3779.5275590551178px) matrix3d(0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15); /* misc.css:8:3-9:72 */
+    image:dir(ltr)
+      -gtk-icon-transform: matrix(1, 0, 0, 0, 1, 0) translate3d(20px, 0, 0) scale(1, 2.3999999999999999) rotate3d(1, 2, 3, 25deg); /* misc.css:13:3-14:49 */
+    picture:dir(ltr)
+      -gtk-icon-transform: translate3d(1px, 2px, 3px) scale(1) scale(1, 2) scale3d(1, 1, 3) skewX(20deg) skewY(-10deg) translate3d(1px, 0, 0) translate3d(0, 2px, 0) translate3d(0, 0, 3px); /* misc.css:18:3-20:40 */

testsuite/css/style/misc.ui

@@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<interface>
+  <object class="GtkWindow" id="window1">
+    <property name="can_focus">False</property>
+    <property name="decorated">0</property>
+    <child>
+      <object class="GtkBox">
+        <property name="visible">True</property>
+        <child>
+          <object class="GtkLabel">
+          </object>
+        </child>
+        <child>
+          <object class="GtkImage">
+          </object>
+        </child>
+        <child>
+          <object class="GtkPicture">
+          </object>
+        </child>
+      </object>
+    </child>
+  </object>
+</interface>