tests/rustdoc-gui/search-result-color.goml

   1 // The goal of this test is to ensure the color of the text is the one expected.
   2
   3 define-function: (
   4     "check-result-color",
   5     (result_kind, color, hover_color),
   6     block {
   7         assert-css: (".result-" + |result_kind| + " ." + |result_kind|, {"color": |color|}, ALL)
   8         assert-css: (
   9             ".result-" + |result_kind|,
  10             {"color": |entry_color|, "background-color": |background_color|},
  11         )
  12         move-cursor-to: ".result-" + |result_kind|
  13         assert-css: (
  14             ".result-" + |result_kind| + ":hover",
  15             {"color": |hover_entry_color|, "background-color": |hover_background_color|},
  16         )
  17         assert-css: (
  18             ".result-" + |result_kind| + ":hover ." + |result_kind|,
  19             {"color": |hover_color|},
  20         )
  21         move-cursor-to: ".search-input"
  22         focus: ".result-" + |result_kind|
  23         assert-css: (
  24             ".result-" + |result_kind| + ":focus",
  25             {"color": |hover_entry_color|, "background-color": |hover_background_color|},
  26         )
  27         assert-css: (
  28             ".result-" + |result_kind| + ":focus ." + |result_kind|,
  29             {"color": |hover_color|},
  30         )
  31     },
  32 )
  33
  34 goto: "file://" + |DOC_PATH| + "/test_docs/index.html?search=coo"
  35
  36 // This is needed so that the text color is computed.
  37 show-text: true
  38
  39 // Ayu theme
  40 local-storage: {
  41     "rustdoc-theme": "ayu",
  42     "rustdoc-use-system-theme": "false",
  43 }
  44 reload:
  45
  46 // Waiting for the search results to appear...
  47 wait-for: "#search-tabs"
  48 assert-css: (
  49     "#search-tabs > button > .count",
  50     {"color": "rgb(136, 136, 136)"},
  51     ALL,
  52 )
  53 assert-css: (
  54     "//*[@class='desc'][text()='Just a normal struct.']",
  55     {"color": "rgb(197, 197, 197)"},
  56 )
  57 assert-css: (
  58     "//*[@class='result-name']/*[text()='test_docs::']",
  59     {"color": "rgb(0, 150, 207)"},
  60 )
  61
  62 // Checking the color of the bottom border.
  63 assert-css: (
  64     ".search-results > a",
  65     {"border-bottom-color": "rgba(170, 170, 170, 0.2)"}
  66 )
  67
  68 // Checking the color of "keyword" text.
  69 assert-css: (
  70     "//*[@class='result-name']//*[text()='(keyword)']",
  71     {"color": "rgb(120, 135, 151)"},
  72 )
  73
  74 store-value: (entry_color, "rgb(0, 150, 207)") // color of the search entry
  75 store-value: (hover_entry_color, "rgb(255, 255, 255)") // color of the hovered/focused search entry
  76 store-value: (background_color, "rgba(0, 0, 0, 0)") // background color
  77 store-value: (hover_background_color, "rgb(60, 60, 60)") // hover background color
  78
  79 call-function: (
  80     "check-result-color", (
  81         "keyword", // item kind
  82         "rgb(57, 175, 215)", // color of item kind
  83         "rgb(57, 175, 215)", // color of hovered/focused item kind
  84     ),
  85 )
  86 call-function: (
  87     "check-result-color", (
  88         "struct", // item kind
  89         "rgb(255, 160, 165)", // color of item kind
  90         "rgb(255, 160, 165)", // color of hovered/focused item kind
  91     ),
  92 )
  93 call-function: (
  94     "check-result-color", (
  95         "associatedtype", // item kind
  96         "rgb(57, 175, 215)", // color of item kind
  97         "rgb(57, 175, 215)", // color of hovered/focused item kind
  98     ),
  99 )
 100 call-function: (
 101     "check-result-color", (
 102         "tymethod", // item kind
 103         "rgb(253, 214, 135)", // color of item kind
 104         "rgb(253, 214, 135)", // color of hovered/focused item kind
 105     ),
 106 )
 107 call-function: (
 108     "check-result-color", (
 109         "method", // item kind
 110         "rgb(253, 214, 135)", // color of item kind
 111         "rgb(253, 214, 135)", // color of hovered/focused item kind
 112     ),
 113 )
 114 call-function: (
 115     "check-result-color", (
 116         "structfield", // item kind
 117         "rgb(0, 150, 207)", // color of item kind
 118         "rgb(255, 255, 255)", // color of hovered/focused item kind
 119     ),
 120 )
 121 call-function: (
 122     "check-result-color", (
 123         "macro", // item kind
 124         "rgb(163, 122, 204)", // color of item kind
 125         "rgb(163, 122, 204)", // color of hovered/focused item kind
 126     ),
 127 )
 128 call-function: (
 129     "check-result-color", (
 130         "fn", // item kind
 131         "rgb(253, 214, 135)", // color of item kind
 132         "rgb(253, 214, 135)", // color of hovered/focused item kind
 133     ),
 134 )
 135
 136 // Checking the `<a>` container.
 137 move-cursor-to: ".search-input"
 138 focus: ".search-input" // To ensure the `<a>` container isnt focus or hover.
 139 assert-css: (
 140     "//*[@class='result-name']/*[text()='test_docs::']/ancestor::a",
 141     {"color": "rgb(0, 150, 207)", "background-color": "rgba(0, 0, 0, 0)"},
 142     ALL,
 143 )
 144
 145 // Checking color and background on hover.
 146 move-cursor-to: "//*[@class='desc'][text()='Just a normal struct.']"
 147 assert-css: (
 148     "//*[@class='result-name']/*[text()='test_docs::']",
 149     {"color": "rgb(255, 255, 255)"},
 150 )
 151 assert-css: (
 152     "//*[@class='result-name']/*[text()='test_docs::']/ancestor::a",
 153     {"color": "rgb(255, 255, 255)", "background-color": "rgb(60, 60, 60)"},
 154 )
 155
 156 // Dark theme
 157 local-storage: {
 158     "rustdoc-theme": "dark",
 159     "rustdoc-use-system-theme": "false",
 160 }
 161 reload:
 162
 163 // Waiting for the search results to appear...
 164 wait-for: "#search-tabs"
 165 assert-css: (
 166     "#search-tabs > button > .count",
 167     {"color": "rgb(136, 136, 136)"},
 168     ALL,
 169 )
 170 assert-css: (
 171     "//*[@class='desc'][text()='Just a normal struct.']",
 172     {"color": "rgb(221, 221, 221)"},
 173 )
 174 assert-css: (
 175     "//*[@class='result-name']/*[text()='test_docs::']",
 176     {"color": "rgb(221, 221, 221)"},
 177 )
 178
 179 // Checking the color of the bottom border.
 180 assert-css: (
 181     ".search-results > a",
 182     {"border-bottom-color": "rgba(170, 170, 170, 0.2)"}
 183 )
 184
 185 // Checking the color for "keyword" text.
 186 assert-css: (
 187     "//*[@class='result-name']//*[text()='(keyword)']",
 188     {"color": "rgb(221, 221, 221)"},
 189 )
 190
 191 store-value: (entry_color, "rgb(221, 221, 221)") // color of the search entry
 192 store-value: (hover_entry_color, "rgb(221, 221, 221)") // color of the hovered/focused search entry
 193 store-value: (background_color, "rgba(0, 0, 0, 0)") // background color
 194 store-value: (hover_background_color, "rgb(97, 97, 97)") // hover background color
 195
 196 call-function: (
 197     "check-result-color", (
 198         "keyword", // item kind
 199         "rgb(210, 153, 29)", // color of item kind
 200         "rgb(210, 153, 29)", // color of hovered/focused item kind
 201     ),
 202 )
 203 call-function: (
 204     "check-result-color", (
 205         "struct", // item kind
 206         "rgb(45, 191, 184)", // color of item kind
 207         "rgb(45, 191, 184)", // color of hovered/focused item kind
 208     ),
 209 )
 210 call-function: (
 211     "check-result-color", (
 212         "associatedtype", // item kind
 213         "rgb(210, 153, 29)", // color of item kind
 214         "rgb(210, 153, 29)", // color of hovered/focused item kind
 215     ),
 216 )
 217 call-function: (
 218     "check-result-color", (
 219         "tymethod", // item kind
 220         "rgb(43, 171, 99)", // color of item kind
 221         "rgb(43, 171, 99)", // color of hovered/focused item kind
 222     ),
 223 )
 224 call-function: (
 225     "check-result-color", (
 226         "method", // item kind
 227         "rgb(43, 171, 99)", // color of item kind
 228         "rgb(43, 171, 99)", // color of hovered/focused item kind
 229     ),
 230 )
 231 call-function: (
 232     "check-result-color", (
 233         "structfield", // item kind
 234         "rgb(221, 221, 221)", // color of item kind
 235         "rgb(221, 221, 221)", // color of hovered/focused item kind
 236     ),
 237 )
 238 call-function: (
 239     "check-result-color", (
 240         "macro", // item kind
 241         "rgb(9, 189, 0)", // color of item kind
 242         "rgb(9, 189, 0)", // color of hovered/focused item kind
 243     ),
 244 )
 245 call-function: (
 246     "check-result-color", (
 247         "fn", // item kind
 248         "rgb(43, 171, 99)", // color of item kind
 249         "rgb(43, 171, 99)", // color of hovered/focused item kind
 250     ),
 251 )
 252
 253 // Checking the `<a>` container.
 254 move-cursor-to: ".search-input"
 255 focus: ".search-input" // To ensure the `<a>` container isnt focus or hover.
 256 assert-css: (
 257     "//*[@class='result-name']/*[text()='test_docs::']/ancestor::a",
 258     {"color": "rgb(221, 221, 221)", "background-color": "rgba(0, 0, 0, 0)"},
 259 )
 260
 261 // Light theme
 262 local-storage: {"rustdoc-theme": "light", "rustdoc-use-system-theme": "false"}
 263 reload:
 264
 265 // Waiting for the search results to appear...
 266 wait-for: "#search-tabs"
 267 assert-css: (
 268     "#search-tabs > button > .count",
 269     {"color": "rgb(136, 136, 136)"},
 270     ALL,
 271 )
 272 assert-css: (
 273     "//*[@class='desc'][text()='Just a normal struct.']",
 274     {"color": "rgb(0, 0, 0)"},
 275 )
 276 assert-css: (
 277     "//*[@class='result-name']/*[text()='test_docs::']",
 278     {"color": "rgb(0, 0, 0)"},
 279 )
 280
 281 // Checking the color of the bottom border.
 282 assert-css: (
 283     ".search-results > a",
 284     {"border-bottom-color": "rgba(170, 170, 170, 0.2)"}
 285 )
 286
 287 // Checking the color for "keyword" text.
 288 assert-css: (
 289     "//*[@class='result-name']//*[text()='(keyword)']",
 290     {"color": "rgb(0, 0, 0)"},
 291 )
 292
 293 store-value: (entry_color, "rgb(0, 0, 0)") // color of the search entry
 294 store-value: (hover_entry_color, "rgb(0, 0, 0)") // color of the hovered/focused search entry
 295 store-value: (background_color, "rgba(0, 0, 0, 0)") // background color
 296 store-value: (hover_background_color, "rgb(204, 204, 204)") // hover background color
 297
 298 call-function: (
 299     "check-result-color", (
 300         "keyword", // item kind
 301         "rgb(56, 115, 173)", // color of item kind
 302         "rgb(56, 115, 173)", // color of hovered/focused item kind
 303     ),
 304 )
 305 call-function: (
 306     "check-result-color", (
 307         "struct", // item kind
 308         "rgb(173, 55, 138)", // color of item kind
 309         "rgb(173, 55, 138)", // color of hovered/focused item kind
 310     ),
 311 )
 312 call-function: (
 313     "check-result-color", (
 314         "associatedtype", // item kind
 315         "rgb(56, 115, 173)", // color of item kind
 316         "rgb(56, 115, 173)", // color of hovered/focused item kind
 317     ),
 318 )
 319 call-function: (
 320     "check-result-color", (
 321         "tymethod", // item kind
 322         "rgb(173, 124, 55)", // color of item kind
 323         "rgb(173, 124, 55)", // color of hovered/focused item kind
 324     ),
 325 )
 326 call-function: (
 327     "check-result-color", (
 328         "method", // item kind
 329         "rgb(173, 124, 55)", // color of item kind
 330         "rgb(173, 124, 55)", // color of hovered/focused item kind
 331     ),
 332 )
 333 call-function: (
 334     "check-result-color", (
 335         "structfield", // item kind
 336         "rgb(0, 0, 0)", // color of item kind
 337         "rgb(0, 0, 0)", // color of hovered/focused item kind
 338     ),
 339 )
 340 call-function: (
 341     "check-result-color", (
 342         "macro", // item kind
 343         "rgb(6, 128, 0)", // color of item kind
 344         "rgb(6, 128, 0)", // color of hovered/focused item kind
 345     ),
 346 )
 347 call-function: (
 348     "check-result-color", (
 349         "fn", // item kind
 350         "rgb(173, 124, 55)", // color of item kind
 351         "rgb(173, 124, 55)", // color of hovered/focused item kind
 352     ),
 353 )
 354
 355 // Checking the `<a>` container.
 356 move-cursor-to: ".search-input"
 357 focus: ".search-input" // To ensure the `<a>` container isnt focus or hover.
 358 assert-css: (
 359     "//*[@class='result-name']/*[text()='test_docs::']/ancestor::a",
 360     {"color": "rgb(0, 0, 0)", "background-color": "rgba(0, 0, 0, 0)"},
 361 )
 362
 363 // Check the alias.
 364 goto: "file://" + |DOC_PATH| + "/test_docs/index.html"
 365 // If the text isn't displayed, the browser doesn't compute color style correctly...
 366 show-text: true
 367
 368 define-function: (
 369     "check-alias",
 370     (theme, alias, grey),
 371     block {
 372         local-storage: {"rustdoc-theme": |theme|, "rustdoc-use-system-theme": "false"}
 373         reload:
 374         write: (".search-input", "thisisanalias")
 375         // To be SURE that the search will be run.
 376         press-key: 'Enter'
 377         // Waiting for the search results to appear...
 378         wait-for: "#search-tabs"
 379         // Checking that the colors for the alias element are the ones expected.
 380         assert-css: (".result-name > .alias", {"color": |alias|})
 381         assert-css: (".result-name > .alias > .grey", {"color": |grey|})
 382         // Leave the search results to prevent reloading with an already filled search input.
 383         press-key: "Escape"
 384     },
 385 )
 386
 387 call-function: ("check-alias", {
 388     "theme": "ayu",
 389     "alias": "rgb(197, 197, 197)",
 390     "grey": "rgb(153, 153, 153)",
 391 })
 392 call-function: ("check-alias", {
 393     "theme": "dark",
 394     "alias": "rgb(255, 255, 255)",
 395     "grey": "rgb(204, 204, 204)",
 396 })
 397 call-function: ("check-alias", {
 398     "theme": "light",
 399     "alias": "rgb(0, 0, 0)",
 400     "grey": "rgb(153, 153, 153)",
 401 })