+
+
+ )}
+ />
} />
} />
} />
diff --git a/src/setupTest.js b/src/setupTest.js
index 95b3726..e2e601f 100755
--- a/src/setupTest.js
+++ b/src/setupTest.js
@@ -1,3 +1,11 @@
import 'core-js/stable';
import 'regenerator-runtime/runtime';
import '@testing-library/jest-dom';
+
+import MockedPluginSlot from './tests/MockedPluginSlot';
+
+jest.mock('@openedx/frontend-plugin-framework', () => ({
+ ...jest.requireActual('@openedx/frontend-plugin-framework'),
+ Plugin: () => 'Plugin',
+ PluginSlot: MockedPluginSlot,
+}));
diff --git a/src/tests/MockedPluginSlot.jsx b/src/tests/MockedPluginSlot.jsx
new file mode 100644
index 0000000..e86952e
--- /dev/null
+++ b/src/tests/MockedPluginSlot.jsx
@@ -0,0 +1,26 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+
+const MockedPluginSlot = ({ children, id }) => (
+
+ PluginSlot_{id}
+ { children &&
{children}
}
+
+);
+
+MockedPluginSlot.displayName = 'PluginSlot';
+
+MockedPluginSlot.propTypes = {
+ children: PropTypes.oneOfType([
+ PropTypes.arrayOf(PropTypes.node),
+ PropTypes.node,
+ ]),
+ id: PropTypes.string,
+};
+
+MockedPluginSlot.defaultProps = {
+ children: undefined,
+ id: undefined,
+};
+
+export default MockedPluginSlot;
diff --git a/src/tests/MockedPluginSlot.test.jsx b/src/tests/MockedPluginSlot.test.jsx
new file mode 100644
index 0000000..b830b68
--- /dev/null
+++ b/src/tests/MockedPluginSlot.test.jsx
@@ -0,0 +1,43 @@
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import MockedPluginSlot from './MockedPluginSlot';
+
+describe('MockedPluginSlot', () => {
+ it('renders mock plugin with "PluginSlot" text', () => {
+ render();
+
+ const component = screen.getByText('PluginSlot_test_plugin');
+ expect(component).toBeInTheDocument();
+ });
+
+ it('renders as the slot children directly if there is content within', () => {
+ render(
+
+
+ How much wood could a woodchuck chuck if a woodchuck could chuck wood?
+
+
,
+ );
+
+ const component = screen.getByRole('article');
+ expect(component).toBeInTheDocument();
+
+ // Direct children
+ const quote = component.querySelector(':scope > q');
+ expect(quote.getAttribute('role')).toBe('note');
+ });
+
+ it('renders mock plugin with a data-testid ', () => {
+ render(
+
+ I am selling these fine leather jackets.
+ ,
+ );
+
+ const component = screen.getByTestId('guybrush');
+ expect(component).toBeInTheDocument();
+
+ const quote = component.querySelector('[role=note]');
+ expect(quote).toBeInTheDocument();
+ });
+});