Fix: Clear console only on hot reload

Fixes #723.

src/rsg-components/Playground/Playground.spec.js

@@ -22,10 +22,12 @@ const options = {
 			showCode: false,
 			highlightTheme: 'base16-light',
 		},
+		codeRevision: 0,
 		slots,
 	},
 	childContextTypes: {
 		slots: PropTypes.object.isRequired,
+		codeRevision: PropTypes.number.isRequired,
 	},
 };
 

src/rsg-components/Preview/Preview.js

@@ -42,6 +42,7 @@ export default class Preview extends Component {
 	};
 	static contextTypes = {
 		config: PropTypes.object.isRequired,
+		codeRevision: PropTypes.number.isRequired,
 	};
 
 	constructor() {
@@ -55,7 +56,12 @@ export default class Preview extends Component {
 	}
 
 	componentDidMount() {
-		console.clear(); // eslint-disable-line no-console
+		// Clear console after hot reload, do not clear on the first load to keep any warnings
+		if (this.context.codeRevision > 0) {
+			// eslint-disable-next-line no-console
+			console.clear();
+		}
+
 		this.executeCode();
 	}
 

src/rsg-components/Preview/Preview.spec.js

@@ -11,9 +11,18 @@ const options = {
 		config: {
 			compilerConfig: {},
 		},
+		codeRevision: 0,
 	},
 };
 
+const console$error = console.error;
+const console$clear = console.clear;
+
+afterEach(() => {
+	console.error = console$error;
+	console.clear = console$clear;
+});
+
 it('should unmount Wrapper component', () => {
 	const actual = mount(<Preview code={code} evalInContext={evalInContext} />, options);
 
@@ -23,7 +32,6 @@ it('should unmount Wrapper component', () => {
 });
 
 it('should not not fail when Wrapper wasn’t mounted', () => {
-	const consoleError = console.error;
 	console.error = jest.fn();
 
 	const actual = mount(<Preview code="pizza" evalInContext={evalInContext} />, options);
@@ -33,15 +41,27 @@ it('should not not fail when Wrapper wasn’t mounted', () => {
 	expect(node.innerHTML).toBe('');
 	actual.unmount();
 	expect(node.innerHTML).toBe('');
-
-	console.error = consoleError;
 });
 
 it('should render component renderer', () => {
-	const actual = shallow(
-		<Preview code={code} evalInContext={evalInContext} />,
-		Object.assign({}, options, { disableLifecycleMethods: true })
-	);
+	const actual = shallow(<Preview code={code} evalInContext={evalInContext} />, {
+		...options,
+		disableLifecycleMethods: true,
+	});
 
 	expect(actual).toMatchSnapshot();
 });
+
+it('should not clear console on initial mount', () => {
+	console.clear = jest.fn();
+	mount(<Preview code={code} evalInContext={evalInContext} />, options);
+	expect(console.clear).toHaveBeenCalledTimes(0);
+});
+
+it('should clear console on second mount', () => {
+	console.clear = jest.fn();
+	mount(<Preview code={code} evalInContext={evalInContext} />, {
+		context: { ...options.context, codeRevision: 1 },
+	});
+	expect(console.clear).toHaveBeenCalledTimes(1);
+});

test/jestsetup.js

@@ -15,19 +15,6 @@ global.mount = mount;
 // Get class names from styles function
 global.classes = styles => keymirror(styles(theme));
 
-// Skip createElement warnings but fail tests on any other warning
-console.error = message => {
-	if (
-		!/(Warning: Accessing PropTypes via the main React package|React.createClass is deprecated)/.test(
-			message
-		)
-	) {
-		throw new Error(message);
-	}
-};
-
-console.clear = jest.fn();
-
 // document.createRange “polyfill” for CodeMirror
 document.createRange = function() {
 	return {