mirror of https://github.com/apache/superset.git
fix(dashboard-css): make to load saved css template (#19840)
* fix(dashboard-css): make to load saved css template * fix(dashboard-css): make to update state css with componentDidMount * fix(dashobard-css): make to inject custom css after updateCss * fix(dashboard-css): make to add RTL for custom css * fix(dashboard-css): make to fix lint issue
This commit is contained in:
parent
f5e9f0eb3b
commit
4a835a4299
|
@ -17,6 +17,8 @@
|
|||
* under the License.
|
||||
*/
|
||||
import React from 'react';
|
||||
import { shallow } from 'enzyme';
|
||||
import sinon from 'sinon';
|
||||
import { render, screen } from 'spec/helpers/testing-library';
|
||||
import userEvent from '@testing-library/user-event';
|
||||
import fetchMock from 'fetch-mock';
|
||||
|
@ -202,3 +204,29 @@ test('should show the properties modal', async () => {
|
|||
userEvent.click(screen.getByText('Edit dashboard properties'));
|
||||
expect(editModeOnProps.showPropertiesModal).toHaveBeenCalledTimes(1);
|
||||
});
|
||||
|
||||
describe('UNSAFE_componentWillReceiveProps', () => {
|
||||
let wrapper: any;
|
||||
const mockedProps = createProps();
|
||||
const props = { ...mockedProps, customCss: '' };
|
||||
|
||||
beforeEach(() => {
|
||||
wrapper = shallow(<HeaderActionsDropdown {...props} />);
|
||||
wrapper.setState({ css: props.customCss });
|
||||
sinon.spy(wrapper.instance(), 'setState');
|
||||
});
|
||||
|
||||
afterEach(() => {
|
||||
wrapper.instance().setState.restore();
|
||||
});
|
||||
|
||||
it('css should update state and inject custom css', () => {
|
||||
wrapper.instance().UNSAFE_componentWillReceiveProps({
|
||||
...props,
|
||||
customCss: mockedProps.customCss,
|
||||
});
|
||||
expect(wrapper.instance().setState.calledOnce).toBe(true);
|
||||
const stateKeys = Object.keys(wrapper.instance().setState.lastCall.args[0]);
|
||||
expect(stateKeys).toContain('css');
|
||||
});
|
||||
});
|
||||
|
|
|
@ -136,10 +136,15 @@ class HeaderActionsDropdown extends React.PureComponent {
|
|||
});
|
||||
}
|
||||
|
||||
UNSAFE_componentWillReceiveProps(nextProps) {
|
||||
if (this.props.customCss !== nextProps.customCss) {
|
||||
this.setState({ css: nextProps.customCss }, () => {
|
||||
injectCustomCss(nextProps.customCss);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
changeCss(css) {
|
||||
this.setState({ css }, () => {
|
||||
injectCustomCss(css);
|
||||
});
|
||||
this.props.onChange();
|
||||
this.props.updateCss(css);
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue