-
Notifications
You must be signed in to change notification settings - Fork 204
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat: Added PluginSlot wrapping UpgradeNotification components (#1366)
* chore: Updated PluginSlot mock to support children and test ids * chore: Updated mocked PluginSlot * chore: Added unit test for MockedPluginSlot * fix: Updated slot name ids
- Loading branch information
Showing
7 changed files
with
138 additions
and
31 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,25 @@ | ||
import React from 'react'; | ||
import PropTypes from 'prop-types'; | ||
|
||
const MockedPluginSlot = ({ children, testId }) => { | ||
if (!testId) { return children ?? 'PluginSlot'; } // Return its content if PluginSlot slot is wrapping any. | ||
|
||
return <div data-testid={testId}>{children}</div>; | ||
}; | ||
|
||
MockedPluginSlot.displayName = 'PluginSlot'; | ||
|
||
MockedPluginSlot.propTypes = { | ||
children: PropTypes.oneOfType([ | ||
PropTypes.arrayOf(PropTypes.node), | ||
PropTypes.node, | ||
]), | ||
testId: PropTypes.string, | ||
}; | ||
|
||
MockedPluginSlot.defaultProps = { | ||
children: undefined, | ||
testId: undefined, | ||
}; | ||
|
||
export default MockedPluginSlot; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,43 @@ | ||
import React from 'react'; | ||
import { render, screen } from '@testing-library/react'; | ||
import MockedPluginSlot from './MockedPluginSlot'; | ||
|
||
describe('MockedPluginSlot', () => { | ||
it('renders as plain "PluginSlot" text node if no clildren nor testId is', () => { | ||
render(<MockedPluginSlot />); | ||
|
||
const component = screen.getByText('PluginSlot'); | ||
expect(component).toBeInTheDocument(); | ||
}); | ||
|
||
it('renders as the slot children directly if there is content within and no testId', () => { | ||
render( | ||
<div role="article"> | ||
<MockedPluginSlot> | ||
<q role="note">How much wood could a woodchuck chuck if a woodchuck could chuck wood?</q> | ||
</MockedPluginSlot> | ||
</div>, | ||
); | ||
|
||
const component = screen.getByRole('article'); | ||
expect(component).toBeInTheDocument(); | ||
|
||
// Direct children | ||
const quote = component.querySelector(':scope > q'); | ||
expect(quote.getAttribute('role')).toBe('note'); | ||
}); | ||
|
||
it('renders a div when a testId is provided ', () => { | ||
render( | ||
<MockedPluginSlot testId="guybrush"> | ||
<q role="note">I am selling these fine leather jackets.</q> | ||
</MockedPluginSlot>, | ||
); | ||
|
||
const component = screen.getByTestId('guybrush'); | ||
expect(component).toBeInTheDocument(); | ||
|
||
const quote = component.querySelector('[role=note]'); | ||
expect(quote).toBeInTheDocument(); | ||
}); | ||
}); |