107 lines
4.3 KiB
Plaintext
107 lines
4.3 KiB
Plaintext
// ignore-tidy-linelength
|
|
// Checks that the search results have the expected width.
|
|
include: "utils.goml"
|
|
go-to: "file://" + |DOC_PATH| + "/test_docs/index.html"
|
|
set-window-size: (900, 1000)
|
|
write-into: (".search-input", "test")
|
|
// To be SURE that the search will be run.
|
|
press-key: 'Enter'
|
|
wait-for: "#crate-search"
|
|
// The width is returned by "getComputedStyle" which returns the exact number instead of the
|
|
// CSS rule which is "50%"...
|
|
assert-size: (".search-results div.desc", {"width": 248})
|
|
store-size: (".search-results .result-name .typename", {"width": width})
|
|
set-window-size: (600, 100)
|
|
// As counter-intuitive as it may seem, in this width, the width is "100%", which is why
|
|
// when computed it's larger.
|
|
assert-size: (".search-results div.desc", {"width": 566})
|
|
|
|
// The result set is all on one line.
|
|
compare-elements-position-near: (
|
|
".search-results .result-name .typename",
|
|
".search-results .result-name .path",
|
|
{"y": 2},
|
|
)
|
|
compare-elements-position-near-false: (
|
|
".search-results .result-name .typename",
|
|
".search-results .result-name .path",
|
|
{"x": 5},
|
|
)
|
|
// The width of the "typename" isn't fixed anymore in this display mode.
|
|
store-size: (".search-results .result-name .typename", {"width": new_width})
|
|
assert: |new_width| < |width| - 10
|
|
|
|
// Check that if the search is too long on mobile, it'll go under the "typename".
|
|
go-to: "file://" + |DOC_PATH| + "/test_docs/index.html?search=SuperIncrediblyLongLongLongLongLongLongLongGigaGigaGigaMegaLongLongLongStructName"
|
|
wait-for: "#crate-search"
|
|
compare-elements-position-near: (
|
|
".search-results .result-name .typename",
|
|
".search-results .result-name .path",
|
|
{"y": 2, "x": 0},
|
|
)
|
|
compare-elements-size-near: (
|
|
".search-results .result-name",
|
|
".search-results .result-name .path",
|
|
{"width": 8, "height": 8},
|
|
)
|
|
|
|
// Check that the crate filter `<select>` is correctly handled when it goes to next line.
|
|
// To do so we need to update the length of one of its `<option>`.
|
|
set-window-size: (900, 900)
|
|
|
|
// First we check the current width, height and position.
|
|
assert-css: ("#crate-search", {"width": "223px"})
|
|
assert-css: (".search-results-title", {"height": "50px", "width": "640px"})
|
|
assert-css: ("#search", {"width": "640px"})
|
|
|
|
// Then we update the text of one of the `<option>`.
|
|
set-text: (
|
|
"#crate-search option",
|
|
"sdjfaksdjfaksjdbfkadsbfkjsadbfkdsbkfbsadkjfbkdsabfkadsfkjdsafa",
|
|
)
|
|
|
|
// Then we compare again to confirm the height didn't change.
|
|
assert-size: ("#crate-search", {"width": 527})
|
|
assert-size: (".search-results-title", {"height": 50, "width": 640})
|
|
// And we check that the `<select>` isn't bigger than its container (".search-results-title").
|
|
assert-css: ("#search", {"width": "640px"})
|
|
|
|
// Now checking that the crate filter is working as expected too.
|
|
show-text: true
|
|
define-function: (
|
|
"check-filter",
|
|
[theme, border, filter, hover_border, hover_filter],
|
|
block {
|
|
call-function: ("switch-theme", {"theme": |theme|})
|
|
wait-for: "#crate-search"
|
|
assert-css: ("#crate-search", {"border": "1px solid " + |border|})
|
|
assert-css: ("#crate-search-div::after", {"filter": |filter|})
|
|
move-cursor-to: "#crate-search"
|
|
assert-css: ("#crate-search", {"border": "1px solid " + |hover_border|})
|
|
assert-css: ("#crate-search-div::after", {"filter": |hover_filter|})
|
|
move-cursor-to: ".search-input"
|
|
},
|
|
)
|
|
|
|
call-function: ("check-filter", {
|
|
"theme": "ayu",
|
|
"border": "#5c6773",
|
|
"filter": "invert(0.41) sepia(0.12) saturate(4.87) hue-rotate(171deg) brightness(0.94) contrast(0.94)",
|
|
"hover_border": "#e0e0e0",
|
|
"hover_filter": "invert(0.98) sepia(0.12) saturate(0.81) hue-rotate(343deg) brightness(1.13) contrast(0.76)",
|
|
})
|
|
call-function: ("check-filter", {
|
|
"theme": "dark",
|
|
"border": "#e0e0e0",
|
|
"filter": "invert(0.94) sepia(0) saturate(7.21) hue-rotate(255deg) brightness(0.9) contrast(0.9)",
|
|
"hover_border": "#2196f3",
|
|
"hover_filter": "invert(0.69) sepia(0.6) saturate(66.13) hue-rotate(184deg) brightness(1) contrast(0.91)",
|
|
})
|
|
call-function: ("check-filter", {
|
|
"theme": "light",
|
|
"border": "#e0e0e0",
|
|
"filter": "invert(1) sepia(0) saturate(42.23) hue-rotate(289deg) brightness(1.14) contrast(0.76)",
|
|
"hover_border": "#717171",
|
|
"hover_filter": "invert(0.44) sepia(0.18) saturate(0.23) hue-rotate(317deg) brightness(0.96) contrast(0.93)",
|
|
})
|