diff --git a/cypress.json b/cypress.json index eb2ec54231..909454889d 100644 --- a/cypress.json +++ b/cypress.json @@ -1,5 +1,5 @@ { "baseUrl": "http://localhost:3000", - "testFiles": "**/*.visual.js", + "testFiles": "**/*.{spec,visual}.js", "video": false } diff --git a/cypress/integration/Sidebar/Sidebar.spec.js b/cypress/integration/Sidebar/Sidebar.spec.js new file mode 100644 index 0000000000..9c7028e7f6 --- /dev/null +++ b/cypress/integration/Sidebar/Sidebar.spec.js @@ -0,0 +1,20 @@ +/// + +describe('Sidebar: spec', () => { + it('with a Modal', () => { + cy.visit('/maximize/sidebar-and-modal/') + + cy.get('[data-tid="button-modal-open"]').click() + cy.get('[data-tid="modal-content"]').should('be.visible') + + cy.get('[data-tid="button-modal-close"]').click() + cy.get('[data-tid="modal-content"]').should('not.be.visible') + + cy.get('[data-tid="button-sidebar-toggle"]').click() + cy.get('[data-tid="sidebar-home"]').click() + cy.get('[data-tid="sidebar"]').should('be.visible') + + cy.get('[data-tid="button-sidebar-toggle"]').click() + cy.get('[data-tid="sidebar"]').should('not.be.visible') + }) +}) diff --git a/docs/src/examples/modules/Sidebar/Spec/SidebarAndModal.js b/docs/src/examples/modules/Sidebar/Spec/SidebarAndModal.js new file mode 100644 index 0000000000..fa1785ae7f --- /dev/null +++ b/docs/src/examples/modules/Sidebar/Spec/SidebarAndModal.js @@ -0,0 +1,85 @@ +import React from 'react' +import { + Button, + Grid, + Header, + Icon, + Menu, + Segment, + Sidebar, + Modal, +} from 'semantic-ui-react' + +const SidebarAndModal = () => { + const [visible, setVisible] = React.useState(false) + + return ( + <> + + + Hello world! + + + + setVisible(false)} + vertical + visible={visible} + width='thin' + > + + + Home + + + + Games + + + + Channels + + + + + +
Application Content
+ Show Modal + } + header='Reminder!' + content={{ + content: 'Call Benjamin regarding the reports', + 'data-tid': 'modal-content', + }} + actions={[ + 'Snooze', + { + key: 'done', + content: 'Done', + 'data-tid': 'button-modal-close', + positive: true, + }, + ]} + /> +
+
+
+
+
+ + ) +} + +export default SidebarAndModal diff --git a/package.json b/package.json index 868126360b..491320a90b 100644 --- a/package.json +++ b/package.json @@ -68,8 +68,8 @@ "homepage": "https://github.com/Semantic-Org/Semantic-UI-React#readme", "dependencies": { "@babel/runtime": "^7.10.5", - "@fluentui/react-component-event-listener": "~0.51.5", - "@fluentui/react-component-ref": "~0.51.5", + "@fluentui/react-component-event-listener": "~0.51.6", + "@fluentui/react-component-ref": "~0.51.6", "@popperjs/core": "^2.6.0", "@semantic-ui-react/event-stack": "^3.1.2", "clsx": "^1.1.1", diff --git a/yarn.lock b/yarn.lock index b07f53ca36..38522a974d 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1102,17 +1102,17 @@ enabled "2.0.x" kuler "^2.0.0" -"@fluentui/react-component-event-listener@~0.51.5": - version "0.51.5" - resolved "https://registry.yarnpkg.com/@fluentui/react-component-event-listener/-/react-component-event-listener-0.51.5.tgz#cc744ef1a048604925c2a3cd4636638f3b65136c" - integrity sha512-GdKyWJJ/JE4YpE2XCl3ZcwM3fnsfat64M3KD5nrPJCp7CL8n7GR0RbacQqZZa8pd1A9Zp7mBhFm/kQxw52D+hA== +"@fluentui/react-component-event-listener@~0.51.6": + version "0.51.6" + resolved "https://registry.yarnpkg.com/@fluentui/react-component-event-listener/-/react-component-event-listener-0.51.6.tgz#8e193b8bb20570aed09581080f110f5a95b51432" + integrity sha512-XbT3p28N6Bz6TsQSf4drCqJNL133DUYCSvyiWsDl7Y5IWzAMKwGcc4nETxqjP07XvInD9fJW9vOqWFlpLBe1xg== dependencies: "@babel/runtime" "^7.10.4" -"@fluentui/react-component-ref@~0.51.5": - version "0.51.5" - resolved "https://registry.yarnpkg.com/@fluentui/react-component-ref/-/react-component-ref-0.51.5.tgz#a6066223bb3e55439807ce541f28abb14b8850b8" - integrity sha512-EwlQm7ohwdcX8uYYMic+1WSd1FJUByDID4LpUkb+fwoz1qCNEeMsAk8yjqvidOYUddC2LJfG35iEvZ2/Ae41Hg== +"@fluentui/react-component-ref@~0.51.6": + version "0.51.6" + resolved "https://registry.yarnpkg.com/@fluentui/react-component-ref/-/react-component-ref-0.51.6.tgz#ba1fc8a82a49f4775a043079ca8a234f3c02a1c4" + integrity sha512-FrUJKizIdL2PlUji5zMB3cTNICv/zk4/nbX6W9F+FmaEAozEm62MRZWOSAX83bnzPQX0OtPBYTenh+5dAI+BMA== dependencies: "@babel/runtime" "^7.10.4" react-is "^16.6.3"