Prevented workspace switcher from settiong dashboard as the last visited workspace (#1676)
* Prevented workspace switcher from settiong dashboard as the last visited workspace ID * Fixed tests
This commit is contained in:
Harshil Sharma
GitHub
parent
f0ae9630ed
commit
d5be5258af
|
|
@ -3,117 +3,17 @@
|
|||
exports[`components/workspaceSwitcher/WorkspaceSwitcher 2 more workspaces available 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="WorkspaceOptions css-2b097c-container"
|
||||
class="WorkspaceSwitcherWrapper"
|
||||
>
|
||||
<span
|
||||
aria-atomic="false"
|
||||
aria-live="polite"
|
||||
aria-relevant="additions text"
|
||||
class="css-1f43avz-a11yText-A11yText"
|
||||
<div
|
||||
class="WorkspaceSwitcher"
|
||||
>
|
||||
<span
|
||||
id="aria-selection"
|
||||
/>
|
||||
<span
|
||||
id="aria-context"
|
||||
>
|
||||
3 results available. Use Up and Down to choose options, press Enter to select the currently focused option, press Escape to exit the menu.
|
||||
<span>
|
||||
Dashboard
|
||||
</span>
|
||||
</span>
|
||||
<div
|
||||
class="WorkspaceOptions__control WorkspaceOptions__control--is-focused WorkspaceOptions__control--menu-is-open css-1pahdxg-control"
|
||||
>
|
||||
<div
|
||||
class="WorkspaceOptions__value-container css-g1d714-ValueContainer"
|
||||
>
|
||||
<div
|
||||
class="WorkspaceOptions__placeholder css-1wa3eu0-placeholder"
|
||||
>
|
||||
Search...
|
||||
</div>
|
||||
<div
|
||||
class="css-b8ldur-Input"
|
||||
>
|
||||
<div
|
||||
class="WorkspaceOptions__input"
|
||||
style="display: inline-block;"
|
||||
>
|
||||
<input
|
||||
aria-autocomplete="list"
|
||||
autocapitalize="none"
|
||||
autocomplete="off"
|
||||
autocorrect="off"
|
||||
id="react-select-2-input"
|
||||
spellcheck="false"
|
||||
style="box-sizing: content-box; width: 2px; border: 0px; opacity: 1; outline: 0; padding: 0px;"
|
||||
tabindex="0"
|
||||
type="text"
|
||||
value=""
|
||||
/>
|
||||
<div
|
||||
style="position: absolute; top: 0px; left: 0px; visibility: hidden; height: 0px; overflow: scroll; white-space: pre; font-family: -webkit-small-control; letter-spacing: normal; text-transform: none;"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="WorkspaceOptions__indicators css-1hb7zxy-IndicatorsContainer"
|
||||
>
|
||||
<i
|
||||
class="CompassIcon icon-magnify CompassIcon"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="WorkspaceOptions__menu css-26l3qy-menu"
|
||||
>
|
||||
<div
|
||||
class="WorkspaceOptions__menu-list css-4ljt47-MenuList"
|
||||
>
|
||||
<div
|
||||
class="Option "
|
||||
id="react-select-2-option-0"
|
||||
tabindex="-1"
|
||||
>
|
||||
<div
|
||||
class="workspaceTitle"
|
||||
>
|
||||
Dashboard
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="Option "
|
||||
id="react-select-2-option-1"
|
||||
tabindex="-1"
|
||||
>
|
||||
<div
|
||||
class="workspaceTitle"
|
||||
>
|
||||
Workspace 2
|
||||
</div>
|
||||
<div
|
||||
class="boardCount"
|
||||
>
|
||||
2 Boards
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="Option "
|
||||
id="react-select-2-option-2"
|
||||
tabindex="-1"
|
||||
>
|
||||
<div
|
||||
class="workspaceTitle"
|
||||
>
|
||||
Workspace 3
|
||||
</div>
|
||||
<div
|
||||
class="boardCount"
|
||||
>
|
||||
3 Boards
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<i
|
||||
class="CompassIcon icon-chevron-down ChevronDownIcon"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -122,82 +22,163 @@ exports[`components/workspaceSwitcher/WorkspaceSwitcher 2 more workspaces availa
|
|||
exports[`components/workspaceSwitcher/WorkspaceSwitcher no more workspaces available 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="WorkspaceOptions css-2b097c-container"
|
||||
class="WorkspaceSwitcherWrapper"
|
||||
>
|
||||
<span
|
||||
aria-atomic="false"
|
||||
aria-live="polite"
|
||||
aria-relevant="additions text"
|
||||
class="css-1f43avz-a11yText-A11yText"
|
||||
>
|
||||
<span
|
||||
id="aria-selection"
|
||||
/>
|
||||
<span
|
||||
id="aria-context"
|
||||
>
|
||||
1 result available. Use Up and Down to choose options, press Enter to select the currently focused option, press Escape to exit the menu.
|
||||
</span>
|
||||
</span>
|
||||
<div
|
||||
class="WorkspaceOptions__control WorkspaceOptions__control--is-focused WorkspaceOptions__control--menu-is-open css-1pahdxg-control"
|
||||
class="WorkspaceSwitcher"
|
||||
>
|
||||
<div
|
||||
class="WorkspaceOptions__value-container css-g1d714-ValueContainer"
|
||||
>
|
||||
<div
|
||||
class="WorkspaceOptions__placeholder css-1wa3eu0-placeholder"
|
||||
>
|
||||
Search...
|
||||
</div>
|
||||
<div
|
||||
class="css-b8ldur-Input"
|
||||
>
|
||||
<div
|
||||
class="WorkspaceOptions__input"
|
||||
style="display: inline-block;"
|
||||
>
|
||||
<input
|
||||
aria-autocomplete="list"
|
||||
autocapitalize="none"
|
||||
autocomplete="off"
|
||||
autocorrect="off"
|
||||
id="react-select-3-input"
|
||||
spellcheck="false"
|
||||
style="box-sizing: content-box; width: 2px; border: 0px; opacity: 1; outline: 0; padding: 0px;"
|
||||
tabindex="0"
|
||||
type="text"
|
||||
value=""
|
||||
/>
|
||||
<div
|
||||
style="position: absolute; top: 0px; left: 0px; visibility: hidden; height: 0px; overflow: scroll; white-space: pre; font-family: -webkit-small-control; letter-spacing: normal; text-transform: none;"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="WorkspaceOptions__indicators css-1hb7zxy-IndicatorsContainer"
|
||||
>
|
||||
<i
|
||||
class="CompassIcon icon-magnify CompassIcon"
|
||||
/>
|
||||
</div>
|
||||
<span>
|
||||
Dashboard
|
||||
</span>
|
||||
<i
|
||||
class="CompassIcon icon-chevron-down ChevronDownIcon"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`components/workspaceSwitcher/WorkspaceSwitcher open menu 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="WorkspaceSwitcherWrapper"
|
||||
>
|
||||
<div
|
||||
class="WorkspaceSwitcher"
|
||||
>
|
||||
<span>
|
||||
Dashboard
|
||||
</span>
|
||||
<i
|
||||
class="CompassIcon icon-chevron-down ChevronDownIcon"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="WorkspaceOptions__menu css-26l3qy-menu"
|
||||
class="WorkspaceOptions css-2b097c-container"
|
||||
>
|
||||
<span
|
||||
aria-atomic="false"
|
||||
aria-live="polite"
|
||||
aria-relevant="additions text"
|
||||
class="css-1f43avz-a11yText-A11yText"
|
||||
>
|
||||
<span
|
||||
id="aria-selection"
|
||||
/>
|
||||
<span
|
||||
id="aria-context"
|
||||
>
|
||||
4 results available. Use Up and Down to choose options, press Enter to select the currently focused option, press Escape to exit the menu.
|
||||
</span>
|
||||
</span>
|
||||
<div
|
||||
class="WorkspaceOptions__menu-list css-4ljt47-MenuList"
|
||||
class="WorkspaceOptions__control WorkspaceOptions__control--is-focused WorkspaceOptions__control--menu-is-open css-1pahdxg-control"
|
||||
>
|
||||
<div
|
||||
class="Option "
|
||||
id="react-select-3-option-0"
|
||||
tabindex="-1"
|
||||
class="WorkspaceOptions__value-container css-g1d714-ValueContainer"
|
||||
>
|
||||
<div
|
||||
class="workspaceTitle"
|
||||
class="WorkspaceOptions__placeholder css-1wa3eu0-placeholder"
|
||||
>
|
||||
Dashboard
|
||||
Search...
|
||||
</div>
|
||||
<div
|
||||
class="css-b8ldur-Input"
|
||||
>
|
||||
<div
|
||||
class="WorkspaceOptions__input"
|
||||
style="display: inline-block;"
|
||||
>
|
||||
<input
|
||||
aria-autocomplete="list"
|
||||
autocapitalize="none"
|
||||
autocomplete="off"
|
||||
autocorrect="off"
|
||||
id="react-select-2-input"
|
||||
spellcheck="false"
|
||||
style="box-sizing: content-box; width: 2px; border: 0px; opacity: 1; outline: 0; padding: 0px;"
|
||||
tabindex="0"
|
||||
type="text"
|
||||
value=""
|
||||
/>
|
||||
<div
|
||||
style="position: absolute; top: 0px; left: 0px; visibility: hidden; height: 0px; overflow: scroll; white-space: pre; font-family: -webkit-small-control; letter-spacing: normal; text-transform: none;"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="WorkspaceOptions__indicators css-1hb7zxy-IndicatorsContainer"
|
||||
>
|
||||
<i
|
||||
class="CompassIcon icon-magnify CompassIcon"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="WorkspaceOptions__menu css-26l3qy-menu"
|
||||
>
|
||||
<div
|
||||
class="WorkspaceOptions__menu-list css-4ljt47-MenuList"
|
||||
>
|
||||
<div
|
||||
class="Option "
|
||||
id="react-select-2-option-0"
|
||||
tabindex="-1"
|
||||
>
|
||||
<div
|
||||
class="workspaceTitle"
|
||||
>
|
||||
Dashboard
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="Option "
|
||||
id="react-select-2-option-1"
|
||||
tabindex="-1"
|
||||
>
|
||||
<div
|
||||
class="workspaceTitle"
|
||||
>
|
||||
Workspace 1
|
||||
</div>
|
||||
<div
|
||||
class="boardCount"
|
||||
>
|
||||
1 Board
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="Option "
|
||||
id="react-select-2-option-2"
|
||||
tabindex="-1"
|
||||
>
|
||||
<div
|
||||
class="workspaceTitle"
|
||||
>
|
||||
Workspace 2
|
||||
</div>
|
||||
<div
|
||||
class="boardCount"
|
||||
>
|
||||
2 Boards
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="Option "
|
||||
id="react-select-2-option-3"
|
||||
tabindex="-1"
|
||||
>
|
||||
<div
|
||||
class="workspaceTitle"
|
||||
>
|
||||
Workspace 3
|
||||
</div>
|
||||
<div
|
||||
class="boardCount"
|
||||
>
|
||||
3 Boards
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -7,11 +7,19 @@ import {Provider as ReduxProvider} from 'react-redux'
|
|||
|
||||
import {render} from '@testing-library/react'
|
||||
|
||||
import userEvent from '@testing-library/user-event'
|
||||
|
||||
import {createMemoryHistory} from 'history'
|
||||
|
||||
import {Router} from 'react-router-dom'
|
||||
|
||||
import {wrapIntl} from '../../testUtils'
|
||||
|
||||
import {UserWorkspace} from '../../user'
|
||||
|
||||
import WorkspaceOptions from './workspaceOptions'
|
||||
import {UserSettings} from '../../userSettings'
|
||||
|
||||
import WorkspaceSwitcher from './workspaceSwitcher'
|
||||
|
||||
describe('components/workspaceSwitcher/WorkspaceSwitcher', () => {
|
||||
const mockStore = configureStore([])
|
||||
|
|
@ -43,10 +51,7 @@ describe('components/workspaceSwitcher/WorkspaceSwitcher', () => {
|
|||
|
||||
const component = wrapIntl(
|
||||
<ReduxProvider store={store}>
|
||||
<WorkspaceOptions
|
||||
onChange={() => {}}
|
||||
activeWorkspaceId={workspace1.id}
|
||||
/>
|
||||
<WorkspaceSwitcher/>
|
||||
</ReduxProvider>,
|
||||
)
|
||||
|
||||
|
|
@ -63,14 +68,83 @@ describe('components/workspaceSwitcher/WorkspaceSwitcher', () => {
|
|||
|
||||
const component = wrapIntl(
|
||||
<ReduxProvider store={store}>
|
||||
<WorkspaceOptions
|
||||
onChange={() => {}}
|
||||
activeWorkspaceId={workspace1.id}
|
||||
/>
|
||||
<WorkspaceSwitcher/>
|
||||
</ReduxProvider>,
|
||||
)
|
||||
|
||||
const {container} = render(component)
|
||||
expect(container).toMatchSnapshot()
|
||||
})
|
||||
|
||||
test('open menu', () => {
|
||||
const store = mockStore({
|
||||
workspace: {
|
||||
userWorkspaces: new Array<UserWorkspace>(workspace1, workspace2, workspace3),
|
||||
},
|
||||
})
|
||||
|
||||
const component = wrapIntl(
|
||||
<ReduxProvider store={store}>
|
||||
<WorkspaceSwitcher/>
|
||||
</ReduxProvider>,
|
||||
)
|
||||
|
||||
const {container} = render(component)
|
||||
const switcher = container.querySelector('.WorkspaceSwitcher')
|
||||
|
||||
expect(switcher).toBeDefined()
|
||||
expect(switcher).not.toBeNull()
|
||||
|
||||
userEvent.click(switcher as Element)
|
||||
expect(container).toMatchSnapshot()
|
||||
})
|
||||
|
||||
test('switch workspaces', () => {
|
||||
const store = mockStore({
|
||||
workspace: {
|
||||
userWorkspaces: new Array<UserWorkspace>(workspace1, workspace2, workspace3),
|
||||
},
|
||||
})
|
||||
const history = createMemoryHistory()
|
||||
history.push = jest.fn()
|
||||
|
||||
const component = wrapIntl(
|
||||
<ReduxProvider store={store}>
|
||||
<Router history={history}>
|
||||
<WorkspaceSwitcher/>
|
||||
</Router>
|
||||
</ReduxProvider>,
|
||||
)
|
||||
|
||||
const {container} = render(component)
|
||||
const switcher = container.querySelector('.WorkspaceSwitcher')
|
||||
expect(switcher).toBeDefined()
|
||||
expect(switcher).not.toBeNull()
|
||||
|
||||
userEvent.click(switcher as Element)
|
||||
const workspace2Option = container.querySelector('.WorkspaceOptions__menu-list > div:nth-child(3)')
|
||||
expect(workspace2Option).toBeDefined()
|
||||
expect(workspace2Option).not.toBeNull()
|
||||
userEvent.click(workspace2Option as Element)
|
||||
expect(history.push).toBeCalledWith('/workspace/workspace_2')
|
||||
expect(UserSettings.lastWorkspaceId).toBe('workspace_2')
|
||||
|
||||
userEvent.click(switcher as Element)
|
||||
const workspace3Option = container.querySelector('.WorkspaceOptions__menu-list > div:nth-child(4)')
|
||||
expect(workspace3Option).toBeDefined()
|
||||
expect(workspace3Option).not.toBeNull()
|
||||
userEvent.click(workspace3Option as Element)
|
||||
expect(history.push).toBeCalledWith('/workspace/workspace_3')
|
||||
expect(UserSettings.lastWorkspaceId).toBe('workspace_3')
|
||||
|
||||
userEvent.click(switcher as Element)
|
||||
const dashboardOption = container.querySelector('.WorkspaceOptions__menu-list > div:nth-child(1)')
|
||||
expect(dashboardOption).toBeDefined()
|
||||
expect(dashboardOption).not.toBeNull()
|
||||
userEvent.click(dashboardOption as Element)
|
||||
expect(history.push).toBeCalledWith('/dashboard')
|
||||
|
||||
// last workspace ID should not have changed
|
||||
expect(UserSettings.lastWorkspaceId).toBe('workspace_3')
|
||||
})
|
||||
})
|
||||
|
|
|
|||
|
|
@ -62,9 +62,8 @@ const WorkspaceSwitcher = (props: Props): JSX.Element => {
|
|||
newPath = '/dashboard'
|
||||
} else {
|
||||
newPath = `/workspace/${workspaceId}`
|
||||
UserSettings.lastWorkspaceId = workspaceId
|
||||
}
|
||||
|
||||
UserSettings.lastWorkspaceId = workspaceId
|
||||
history.push(newPath)
|
||||
}}
|
||||
/>
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user