streamlit

1
/**
2
 * Copyright (c) Streamlit Inc. (2018-2022) Snowflake Inc. (2022-2024)
3
 *
4
 * Licensed under the Apache License, Version 2.0 (the "License");
5
 * you may not use this file except in compliance with the License.
6
 * You may obtain a copy of the License at
7
 *
8
 *     http://www.apache.org/licenses/LICENSE-2.0
9
 *
10
 * Unless required by applicable law or agreed to in writing, software
11
 * distributed under the License is distributed on an "AS IS" BASIS,
12
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13
 * See the License for the specific language governing permissions and
14
 * limitations under the License.
15
 */
16

17
describe("st.sidebar", () => {
18
  before(() => {
19
    cy.loadApp("http://localhost:3000/");
20

21
    cy.prepForElementSnapshots();
22
  });
23

24
  it("displays sidebar correctly", () => {
25
    cy.get("[data-testid='stSidebar']").matchThemedSnapshots("sidebar");
26
  });
27

28
  it("handles z-index of date input popover", () => {
29
    cy.get("[data-testid='stSidebar'] .stDateInput").should("have.length", 2);
30

31
    cy.get("[data-testid='stSidebar'] .stDateInput")
32
      .first()
33
      .click();
34

35
    cy.get("[data-testid='stSidebar']").matchImageSnapshot(
36
      "date-popover-sidebar",
37
      {
38
        force: true
39
      }
40
    );
41
  });
42

43
  it("handles overwriting elements", () => {
44
    cy.get("[data-testid='stSidebar'] [data-testid='stText']").contains(
45
      "overwritten"
46
    );
47
  });
48

49
  it("collapses the sidebar on mobile resize", () => {
50
    cy.viewport(800, 400);
51
    cy.get("[data-testid='stSidebar']").should(
52
      "have.attr",
53
      "aria-expanded",
54
      "true"
55
    );
56

57
    cy.viewport(400, 800);
58
    cy.get("[data-testid='stSidebar']").should(
59
      "have.attr",
60
      "aria-expanded",
61
      "false"
62
    );
63
  });
64

65
  it("does not collapse on text input on mobile", () => {
66
    cy.viewport(400, 800);
67
    // Expand the sidebar on mobile, with a manual click
68
    cy.get("[data-testid='collapsedControl'] button").click();
69

70
    cy.get("[data-testid='stSidebar'] .stTextInput input").click();
71

72
    cy.get("[data-testid='stSidebar']").should(
73
      "have.attr",
74
      "aria-expanded",
75
      "true"
76
    );
77
  });
78
});
79