Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

DEVPROD-8016: E2E tests for Sectioning #416

Merged
merged 5 commits into from
Oct 3, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
107 changes: 107 additions & 0 deletions apps/parsley/cypress/integration/sectioning.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,107 @@
describe("Sectioning", () => {
beforeEach(() => {
cy.visit(`${logLink}?shareLine=0`);
cy.clickToggle("sections-toggle", true, "log-viewing");
});

it("Toggling the sections options displays and hides sections", () => {
// Check that sections is toggled
cy.toggleDetailsPanel(true);
cy.get("button[data-cy='log-viewing-tab']").click();
cy.dataCy("sections-toggle").should("have.attr", "aria-checked", "true");
cy.toggleDetailsPanel(false);
// Assert sections are visible
cy.dataCy("section-header").should("be.visible");
// Untoggle sections and assert they are hidden
cy.clickToggle("sections-toggle", false, "log-viewing");
cy.dataCy("section-header").should("not.exist");
});

it("Clicking 'Open all subsections' opens all subsections", () => {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This checks that the button updates, can we check the sections themselves are open?

cy.dataCy("open-all-sections-btn").click();
cy.dataCy("caret-toggle").should(
"have.attr",
"aria-label",
"Close section",
);
cy.dataCy("caret-toggle").should(
"not.have.attr",
"aria-label",
"Open section",
);
cy.get("[title='Use shift+click to select multiple lines']").should(
"have.length",
33,
);
cy.get("[title='Use shift+click to select multiple lines']").each(
(section, i) => {
cy.wrap(section).should("have.attr", "data-cy", `line-index-${i}`);
},
);
});

it("Clicking 'Close all subsections' opens all subsections", () => {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Same as above but opposite 😁

cy.dataCy("close-all-sections-btn").click();
cy.dataCy("caret-toggle").should("have.attr", "aria-label", "Open section");
cy.dataCy("caret-toggle").should(
"not.have.attr",
"aria-label",
"Close section",
);
cy.get("[title='Use shift+click to select multiple lines']").should(
"have.length",
9,
);
const openLineNumbers = [0, 1, 2, 8, 9, 9616, 9617, 9618, 9619];
cy.get("[title='Use shift+click to select multiple lines']").each(
(section, i) => {
cy.wrap(section).should(
"have.attr",
"data-cy",
`line-index-${openLineNumbers[i]}`,
);
},
);
});

it("Clicking on a closed caret opens the section and renders the subsection contents ", () => {
cy.get("[data-index='4'] > [data-cy='section-header']").contains(
"Function: f_expansions_write",
);
cy.get(
"[data-index='3'] > [data-cy='section-header'] > [data-cy='caret-toggle']",
).click();
cy.get("[data-index='4'] > [data-cy='section-header']").contains(
"Command: expansions.update (step 1 of 2)",
);
});

it("Clicking on an open caret closes the section and hides the subsection contents", () => {
cy.get("[data-index='9'] > [data-cy='section-header']").contains(
"Command: expansions.write (step 2.1 of 2)",
);
cy.get(
"[data-index='8'] > [data-cy='section-header'] > [data-cy='caret-toggle']",
).click();
cy.get("[data-index='9']").contains(
"[2024/03/12 11:18:36.035] Running task commands failed: running command: command failed: process encountered problem: exit code 1",
);
});

it("Failing command section is open and scrolled to on page load when share line isn't specified", () => {
cy.visit(logLink);
cy.contains(
"[2024/03/12 11:18:36.034] Command 'subprocess.exec' ('check resmoke failure') in function 'run tests' (step 2.20 of 2) failed: process encountered problem: exit code 1.",
).should("be.visible");
});

it("Share line section is open and scrolled to on page load when it is specified", () => {
cy.visit(`${logLink}?shareLine=19`);
cy.contains(
"[2024/03/12 11:01:53.831] rm -rf /data/db/* mongo-diskstats* mongo-*.tgz ~/.aws ~/.boto venv",
).should("be.visible");
});

const logLink =
"/evergreen/mongodb_mongo_master_enterprise_amazon_linux2_arm64_all_feature_flags_jsCore_patch_9801cf147ed208ce4c0ff8dff4a97cdb216f4c22_65f06bd09ccd4eaaccca1391_24_03_12_14_51_29/0/task";
});
2 changes: 1 addition & 1 deletion apps/parsley/cypress/integration/shortcuts.ts
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ describe("Shortcuts", () => {
});

it("should be able to open the keyboard shortcut modal by clicking navbar icon button", () => {
cy.get(`[aria-label="Click to open shortcut modal"]`).click();
cy.get(`[aria-label="Open shortcut modal"]`).click();
cy.dataCy("shortcut-modal").should("be.visible");
});
});
2 changes: 1 addition & 1 deletion apps/parsley/src/components/LogRow/CaretToggle/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ interface Props {
}
const CaretToggle: React.FC<Props> = ({ onClick, open }) => (
<IconButton
aria-label="Click to open or close section"
aria-label={`${open ? "Close" : "Open"} section`}
data-cy="caret-toggle"
onClick={onClick}
>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
>
<button
aria-disabled="false"
aria-label="Click to open or close section"
aria-label="Close section"
class="leafygreen-ui-tcjr3n"
data-cy="caret-toggle"
tabindex="0"
Expand Down Expand Up @@ -71,7 +71,7 @@
>
<button
aria-disabled="false"
aria-label="Click to open or close section"
aria-label="Close section"
class="leafygreen-ui-tcjr3n"
data-cy="caret-toggle"
tabindex="0"
Expand Down Expand Up @@ -133,7 +133,7 @@
>
<button
aria-disabled="false"
aria-label="Click to open or close section"
aria-label="Close section"
class="leafygreen-ui-tcjr3n"
data-cy="caret-toggle"
tabindex="0"
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
>
<button
aria-disabled="false"
aria-label="Click to open or close section"
aria-label="Open or close section"
class="leafygreen-ui-tcjr3n"
data-cy="caret-toggle"
tabindex="0"
Expand Down Expand Up @@ -71,7 +71,7 @@
>
<button
aria-disabled="false"
aria-label="Click to open or close section"
aria-label="Open or close section"
class="leafygreen-ui-tcjr3n"
data-cy="caret-toggle"
tabindex="0"
Expand Down Expand Up @@ -133,7 +133,7 @@
>
<button
aria-disabled="false"
aria-label="Click to open or close section"
aria-label="Open or close section"
class="leafygreen-ui-tcjr3n"
data-cy="caret-toggle"
tabindex="0"
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
>
<button
aria-disabled="false"
aria-label="Click to open or close section"
aria-label="Close section"
class="leafygreen-ui-tcjr3n"
data-cy="caret-toggle"
tabindex="0"
Expand Down Expand Up @@ -54,7 +54,7 @@
>
<button
aria-disabled="false"
aria-label="Click to open or close section"
aria-label="Open section"
class="leafygreen-ui-tcjr3n"
data-cy="caret-toggle"
tabindex="0"
Expand Down Expand Up @@ -115,7 +115,7 @@
>
<button
aria-disabled="false"
aria-label="Click to open or close section"
aria-label="Close section"
class="leafygreen-ui-tcjr3n"
data-cy="caret-toggle"
tabindex="0"
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
>
<button
aria-disabled="false"
aria-label="Click to open or close section"
aria-label="Open or close section"
class="leafygreen-ui-tcjr3n"
data-cy="caret-toggle"
tabindex="0"
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
>
<button
aria-disabled="false"
aria-label="Click to open or close section"
aria-label="Open section"
class="leafygreen-ui-tcjr3n"
data-cy="caret-toggle"
tabindex="0"
Expand Down Expand Up @@ -70,7 +70,7 @@
>
<button
aria-disabled="false"
aria-label="Click to open or close section"
aria-label="Close section"
class="leafygreen-ui-tcjr3n"
data-cy="caret-toggle"
tabindex="0"
Expand Down Expand Up @@ -132,7 +132,7 @@
>
<button
aria-disabled="false"
aria-label="Click to open or close section"
aria-label="Close section"
class="leafygreen-ui-tcjr3n"
data-cy="caret-toggle"
tabindex="0"
Expand Down
2 changes: 1 addition & 1 deletion apps/parsley/src/components/NavBar/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@ const NavBar: React.FC = () => {

<FlexContainer>
<IconButton
aria-label="Click to open shortcut modal"
aria-label="Open shortcut modal"
onClick={() => setOpen(true)}
>
<Icon glyph="InfoWithCircle" />
Expand Down