fix: sidebar UX, sidebar & attach control cypress

* changed "show all" to button
* updated cypress tests for sidebar and attach control
* change "Explore Files" button icon location
This commit is contained in:
Maharshi Patel 2023-09-28 23:35:01 +05:30
parent 2355b9d581
commit cb7415338a
4 changed files with 26 additions and 14 deletions

View file

@ -29,7 +29,8 @@ context("Attach Control", () => {
//Clicking on "Link" button to attach a file using the "Link" button //Clicking on "Link" button to attach a file using the "Link" button
cy.findByRole("button", { name: "Link" }).click(); cy.findByRole("button", { name: "Link" }).click();
cy.findByPlaceholderText("Attach a web link").type( cy.findByPlaceholderText("Attach a web link").type(
"https://wallpaperplay.com/walls/full/8/2/b/72402.jpg" "https://wallpaperplay.com/walls/full/8/2/b/72402.jpg",
{ force: true }
); );
//Clicking on the Upload button to upload the file //Clicking on the Upload button to upload the file

View file

@ -81,7 +81,7 @@ context("Sidebar", () => {
// test "Show All" button // test "Show All" button
cy.get(".attachment-row").should("have.length", 10); cy.get(".attachment-row").should("have.length", 10);
cy.get(".show-all-btn").click(); cy.get(".show-all-btn").click({ force: true });
cy.get(".attachment-row").should("have.length", 12); cy.get(".attachment-row").should("have.length", 12);
}); });
}); });
@ -120,7 +120,7 @@ context("Sidebar", () => {
).click(); ).click();
//To check if filter is applied //To check if filter is applied
cy.click_filter_button().should("contain", "1 filter"); cy.click_filter_button().get(".filter-label").should("contain", "1");
cy.get(".fieldname-select-area > .awesomplete > .form-control").should( cy.get(".fieldname-select-area > .awesomplete > .form-control").should(
"have.value", "have.value",
"Assigned To" "Assigned To"

View file

@ -56,21 +56,22 @@
<li class="explore-full-btn hidden"> <li class="explore-full-btn hidden">
<button class="data-pill btn"> <button class="data-pill btn">
<svg class="es-icon mr-2 icon-sm">
<use href="#es-line-folder-alt"></use>
</svg>
<span class="pill-label ellipsis"> <span class="pill-label ellipsis">
{%= __("Explore Files") %} {%= __("Explore Files") %}
</span> </span>
<svg class="es-icon icon-sm">
<use href="#es-line-folder-alt"></use>
</svg>
</button> </button>
</li> </li>
<button class="show-all-btn hidden">
<svg class="es-icon icon-sm">
<li class="show-all-btn hidden"> <use href="#es-line-preview"></use>
</svg>
<a href="" class="pill-label ellipsis"> <a href="" class="pill-label ellipsis">
{%= __("Show All") %} {%= __("Show All") %}
</a> </a>
</li> </button>
</li> </li>
<li class="attachments-actions"> <li class="attachments-actions">
<button class="data-pill btn add-attachment-btn"> <button class="data-pill btn add-attachment-btn">

View file

@ -397,9 +397,8 @@ body[data-route^="Module"] .main-menu {
display: inline-flex; display: inline-flex;
} }
.attachments-actions { .attachments-actions, .explore-full-btn > .data-pill.btn {
display: flex; display: flex;
gap: 5px;
max-width: 100%; max-width: 100%;
} }
@ -409,8 +408,19 @@ body[data-route^="Module"] .main-menu {
} }
.show-all-btn { .show-all-btn {
margin-top: var(--margin-md); width: 100%;
text-align: center; border: 1px solid var(--border-color);
border-radius: var(--border-radius);
background-color: var(--bg-color);
text-align: start;
padding-left: 8px;
margin-bottom: var(--margin-sm);
a.pill-label.ellipsis {
&:hover {
text-decoration: none;
}
}
} }
.form-assignments, .form-shared { .form-assignments, .form-shared {
.assignments, .shares { .assignments, .shares {