mirror of
https://github.com/overleaf/overleaf.git
synced 2024-11-21 20:47:08 -05:00
b62cb86bf8
* Create a new shared `SplitMenu` component.
* Refactor the pdf compile button & detached compile button:
- Rename `detach-compile-button` to `detach-compile-button-wrapper`
- Rename `pdf-compile-button-inner` to `detach-compile-button`
- Move some of the logic from `detach-compile-button-wrapper` to `detach-compile-button`
- Create a new `compile-button.less` to centralize all of the compile button (detached/non-detached) custom styles rule.
- Extract the animated striped CSS definition to the dedicated CSS file, change the class from `btn-recompile-group-has-changes` to `btn-striped-animated`
- Refactor other className(s) appropriately according to the new component name
- Delete the unused `changes-to-autocompile` css rule since it has not been used anywhere
* Implement the new pdf compile button with the new `SplitMenu` component.
GitOrigin-RevId: d1d055bffd311923fc47b4681605ce8ba8e26f25
67 lines
1.8 KiB
TypeScript
67 lines
1.8 KiB
TypeScript
import SplitMenu from '../../../../frontend/js/shared/components/split-menu'
|
|
|
|
describe('SplitMenu', function () {
|
|
it('renders primary variant', function () {
|
|
cy.mount(
|
|
<SplitMenu
|
|
bsStyle="primary"
|
|
button={{
|
|
text: 'Button Text',
|
|
}}
|
|
dropdown={{
|
|
id: 'pdf-recompile-dropdown',
|
|
}}
|
|
>
|
|
<SplitMenu.Item>Item 1</SplitMenu.Item>
|
|
<SplitMenu.Item>Item 2</SplitMenu.Item>
|
|
<SplitMenu.Item>Item 3</SplitMenu.Item>
|
|
</SplitMenu>
|
|
)
|
|
|
|
cy.get('button.split-menu-button').contains('Button Text')
|
|
cy.get('button.split-menu-button').should('have.class', 'btn-primary')
|
|
cy.get('button.split-menu-dropdown-toggle').should(
|
|
'have.class',
|
|
'btn-primary'
|
|
)
|
|
cy.get('li').should('have.length', 3)
|
|
cy.get('li').contains('Item 1')
|
|
cy.get('li').contains('Item 2')
|
|
cy.get('li').contains('Item 3')
|
|
|
|
cy.get('ul.dropdown-menu').should('not.be.visible')
|
|
cy.get('button.split-menu-dropdown-toggle').click()
|
|
cy.get('ul.dropdown-menu').should('be.visible')
|
|
})
|
|
|
|
it('with custom classNames', function () {
|
|
cy.mount(
|
|
<SplitMenu
|
|
bsStyle="primary"
|
|
button={{
|
|
text: 'Button Text',
|
|
className: 'split-menu-class-1',
|
|
}}
|
|
dropdown={{
|
|
id: 'pdf-recompile-dropdown',
|
|
className: 'split-menu-class-2',
|
|
}}
|
|
dropdownToggle={{
|
|
className: 'split-menu-class-3',
|
|
}}
|
|
>
|
|
<SplitMenu.Item>Item 1</SplitMenu.Item>
|
|
</SplitMenu>
|
|
)
|
|
|
|
cy.get('button.split-menu-button').should(
|
|
'have.class',
|
|
'split-menu-class-1'
|
|
)
|
|
cy.get('div.split-menu-dropdown').should('have.class', 'split-menu-class-2')
|
|
cy.get('button.split-menu-dropdown-toggle').should(
|
|
'have.class',
|
|
'split-menu-class-3'
|
|
)
|
|
})
|
|
})
|