src/test/rustdoc-gui/source-code-page.goml

   1 // Checks that the interactions with the source code pages are working as expected.
   2 goto: "file://" + |DOC_PATH| + "/src/test_docs/lib.rs.html"
   3 show-text: true
   4 // Check that we can click on the line number.
   5 click: ".src-line-numbers > a:nth-child(4)" // This is the anchor for line 4.
   6 // Ensure that the page URL was updated.
   7 assert-document-property: ({"URL": "lib.rs.html#4"}, ENDS_WITH)
   8 assert-attribute: ("//*[@id='4']", {"class": "line-highlighted"})
   9 // Ensure that the default style, with the right border, isn't used.
  10 assert-css: ("//*[@id='4']", {"border-right-width": "0px"})
  11 reload:
  12 assert-attribute: ("//*[@id='4']", {"class": "line-highlighted"})
  13 assert-css: ("//*[@id='4']", {"border-right-width": "0px"})
  14 // We now check that the good anchors are highlighted
  15 goto: "file://" + |DOC_PATH| + "/src/test_docs/lib.rs.html#4-6"
  16 assert-attribute-false: (".src-line-numbers > a:nth-child(3)", {"class": "line-highlighted"})
  17 assert-attribute: (".src-line-numbers > a:nth-child(4)", {"class": "line-highlighted"})
  18 assert-attribute: (".src-line-numbers > a:nth-child(5)", {"class": "line-highlighted"})
  19 assert-attribute: (".src-line-numbers > a:nth-child(6)", {"class": "line-highlighted"})
  20 assert-attribute-false: (".src-line-numbers > a:nth-child(7)", {"class": "line-highlighted"})
  21
  22 define-function: (
  23     "check-colors",
  24     (theme, color, background_color, highlight_color, highlight_background_color),
  25     [
  26         ("local-storage", {"rustdoc-theme": |theme|, "rustdoc-use-system-theme": "false"}),
  27         ("reload"),
  28         ("assert-css", (
  29             ".src-line-numbers > a:not(.line-highlighted)",
  30             {"color": |color|, "background-color": |background_color|},
  31             ALL,
  32         )),
  33         ("assert-css", (
  34             ".src-line-numbers > a.line-highlighted",
  35             {"color": |highlight_color|, "background-color": |highlight_background_color|},
  36             ALL,
  37         )),
  38     ],
  39 )
  40
  41 call-function: ("check-colors", {
  42     "theme": "ayu",
  43     "color": "rgb(92, 103, 115)",
  44     "background_color": "rgba(0, 0, 0, 0)",
  45     "highlight_color": "rgb(112, 128, 144)",
  46     "highlight_background_color": "rgba(255, 236, 164, 0.06)",
  47 })
  48 call-function: ("check-colors", {
  49     "theme": "dark",
  50     "color": "rgb(59, 145, 226)",
  51     "background_color": "rgba(0, 0, 0, 0)",
  52     "highlight_color": "rgb(59, 145, 226)",
  53     "highlight_background_color": "rgb(10, 4, 47)",
  54 })
  55 call-function: ("check-colors", {
  56     "theme": "light",
  57     "color": "rgb(198, 126, 45)",
  58     "background_color": "rgba(0, 0, 0, 0)",
  59     "highlight_color": "rgb(198, 126, 45)",
  60     "highlight_background_color": "rgb(253, 255, 211)",
  61 })
  62
  63 // This is to ensure that the content is correctly align with the line numbers.
  64 compare-elements-position: ("//*[@id='1']", ".rust > code > span", ("y"))
  65 // Check the `href` property so that users can treat anchors as links.
  66 assert-property: (".src-line-numbers > a:nth-child(1)", {
  67     "href": "file://" + |DOC_PATH| + "/src/test_docs/lib.rs.html#1"
  68 })
  69 assert-property: (".src-line-numbers > a:nth-child(2)", {
  70     "href": "file://" + |DOC_PATH| + "/src/test_docs/lib.rs.html#2"
  71 })
  72 assert-property: (".src-line-numbers > a:nth-child(3)", {
  73     "href": "file://" + |DOC_PATH| + "/src/test_docs/lib.rs.html#3"
  74 })
  75 assert-property: (".src-line-numbers > a:nth-child(4)", {
  76     "href": "file://" + |DOC_PATH| + "/src/test_docs/lib.rs.html#4"
  77 })
  78 assert-property: (".src-line-numbers > a:nth-child(5)", {
  79     "href": "file://" + |DOC_PATH| + "/src/test_docs/lib.rs.html#5"
  80 })
  81 assert-property: (".src-line-numbers > a:nth-child(6)", {
  82     "href": "file://" + |DOC_PATH| + "/src/test_docs/lib.rs.html#6"
  83 })
  84
  85 // Assert that the line numbers text is aligned to the right.
  86 assert-css: (".src-line-numbers", {"text-align": "right"})
  87
  88 // Now let's check that clicking on something else than the line number doesn't
  89 // do anything (and certainly not add a `#NaN` to the URL!).
  90 goto: "file://" + |DOC_PATH| + "/src/test_docs/lib.rs.html"
  91 // We use this assert-position to know where we will click.
  92 assert-position: ("//*[@id='1']", {"x": 88, "y": 112})
  93 // We click on the left of the "1" anchor but still in the "src-line-number" `<pre>`.
  94 click: (87, 103)
  95 assert-document-property: ({"URL": "/lib.rs.html"}, ENDS_WITH)
  96
  97 // Checking the source code sidebar.
  98
  99 // First we "open" it.
 100 click: "#src-sidebar-toggle"
 101 assert: ".source-sidebar-expanded"
 102
 103 // We check that the first entry of the sidebar is collapsed
 104 assert-property: ("#source-sidebar details:first-of-type", {"open": "false"})
 105 assert-text: ("#source-sidebar details:first-of-type > summary", "huge_logo")
 106 // We now click on it.
 107 click: "#source-sidebar details:first-of-type > summary"
 108 assert-property: ("#source-sidebar details:first-of-type", {"open": "true"})
 109
 110 // And now we collapse it again.
 111 click: "#source-sidebar details:first-of-type > summary"
 112 assert-property: ("#source-sidebar details:first-of-type", {"open": "false"})
 113
 114 // Check the spacing.
 115 assert-css: ("#source-sidebar > details.dir-entry", {"padding-left": "4px"})
 116
 117 // Check the search form
 118 assert-css: ("nav.sub", {"flex-direction": "row"})
 119 // The goal of this test is to ensure the search input is perfectly centered
 120 // between the top of the page and the top of the gray code block.
 121 // To check this, we maintain the invariant:
 122 //
 123 // offsetTop[nav.sub form] = offsetTop[#main-content] - offsetHeight[nav.sub form] - offsetTop[nav.sub form]
 124 assert-property: ("nav.sub form", {"offsetTop": 28, "offsetHeight": 34})
 125 assert-property: ("#main-content", {"offsetTop": 90})
 126 // 28 = 90 - 34 - 28
 127
 128 // Now do the same check on moderately-sized mobile.
 129 size: (700, 700)
 130 assert-css: ("nav.sub", {"flex-direction": "row"})
 131 assert-property: ("nav.sub form", {"offsetTop": 21, "offsetHeight": 34})
 132 assert-property: ("#main-content", {"offsetTop": 76})
 133 // 21 = 76 - 34 - 21
 134
 135 // Tiny mobile gets a different display where the logo is stacked on top.
 136 size: (450, 700)
 137 assert-css: ("nav.sub", {"flex-direction": "column"})