Changeset View
Changeset View
Standalone View
Standalone View
cypress/integration/sidebar.spec.js
Show All 12 Lines | cy.visit(url, { | ||||
onBeforeLoad: (win) => { | onBeforeLoad: (win) => { | ||||
win.localStorage.clear(); | win.localStorage.clear(); | ||||
} | } | ||||
}); | }); | ||||
}); | }); | ||||
it('should toggle sidebar when swh-push-menu is clicked', function() { | it('should toggle sidebar when swh-push-menu is clicked', function() { | ||||
cy.get('.swh-push-menu') | cy.get('.swh-push-menu') | ||||
.click() | .click(); | ||||
.then(() => { | |||||
cy.get('body') | cy.get('body') | ||||
.should('have.class', 'sidebar-collapse') | .should('have.class', 'sidebar-collapse') | ||||
.get('.nav-link > p') | .get('.nav-link > p') | ||||
.should('have.css', 'opacity', '0'); | .should('not.be.visible'); | ||||
}) | |||||
.get('.swh-push-menu') | cy.get('.swh-push-menu') | ||||
.click() | .click(); | ||||
.then(() => { | |||||
cy.get('body') | cy.get('body') | ||||
.should('have.class', 'sidebar-open') | .should('have.class', 'sidebar-open') | ||||
.get('.nav-link > p') | .get('.nav-link > p') | ||||
.should('not.have.css', 'opacity', '0'); | .should('be.visible'); | ||||
}); | |||||
}); | }); | ||||
it('should have less width when collapsed compared to open', function() { | it('should have less width when collapsed compared to open', function() { | ||||
let collapsedWidth, expandedWidth; | let collapseWidth; | ||||
cy.get('.swh-push-menu') | cy.get('.swh-push-menu') | ||||
.click() | .click() | ||||
.wait(250) | |||||
.get('.swh-sidebar') | .get('.swh-sidebar') | ||||
.should('have.css', 'width') | .wait(250) | ||||
.invoke('width') | |||||
.then((width) => { | .then((width) => { | ||||
collapsedWidth = parseInt(width); | collapseWidth = width; | ||||
}) | }) | ||||
.get('.swh-push-menu') | .get('.swh-push-menu') | ||||
.click() | .click() | ||||
.wait(250) | |||||
.get('.swh-sidebar') | .get('.swh-sidebar') | ||||
.should('have.css', 'width') | .wait(250) | ||||
.then((width) => { | .invoke('width') | ||||
expandedWidth = parseInt(width); | .then(openWidth => { | ||||
}) | assert.isBelow(collapseWidth, openWidth); | ||||
.then(() => { | |||||
assert.isBelow(collapsedWidth, expandedWidth); | |||||
}); | }); | ||||
}); | }); | ||||
}); | }); | ||||
describe('Sidebar Tests on small screens', function() { | describe('Sidebar Tests on small screens', function() { | ||||
beforeEach(function() { | beforeEach(function() { | ||||
cy.viewport('iphone-6'); | cy.viewport('iphone-6'); | ||||
cy.visit(url); | cy.visit(url); | ||||
}); | }); | ||||
it('should be collapsed by default', function() { | it('should be collapsed by default', function() { | ||||
cy.get('.swh-sidebar') | cy.get('.swh-sidebar') | ||||
.should('not.be.visible'); | .should('not.be.visible'); | ||||
}); | }); | ||||
it('should toggle sidebar when swh-push-menu is clicked', function() { | it('should toggle sidebar when swh-push-menu is clicked', function() { | ||||
cy.get('.swh-push-menu') | cy.get('.swh-push-menu') | ||||
.click() | .click() | ||||
.wait(250) | |||||
.get('.swh-sidebar') | .get('.swh-sidebar') | ||||
.should('be.visible') | .should('be.visible') | ||||
.get('#sidebar-overlay') | .get('#sidebar-overlay') | ||||
.click({force: true}) | .click({force: true}) | ||||
.wait(250) | |||||
.get('.swh-sidebar') | .get('.swh-sidebar') | ||||
.should('not.be.visible'); | .should('not.be.visible'); | ||||
}); | }); | ||||
}); | }); |