Move small set test-stories off of React

Author: jmhobbs

test-stories/a.js

@@ -1,9 +1,6 @@
 /* eslint-env browser */
 
-import React from 'react';
-
 import isChromatic from '../isChromatic';
-import AComponent from './a';
 
 export default {
   title: 'Tests',
@@ -12,66 +9,23 @@ export default {
 
 export const WithViewports = {
   render: () => {
-    let bg;
     if (window.matchMedia('(max-width: 400px)').matches) {
-      bg = 'cyan';
+      return 'A';
     } else if (window.matchMedia('(max-width: 800px)').matches) {
-      bg = 'orange';
+      return 'B';
     }
-    return (
-      <AComponent backgroundColor={bg} thing={() => {}}>
-        Contents
-      </AComponent>
-    );
+    return 'C';
   },
 
   parameters: { chromatic: { viewports: [320, 600, 1200] } },
 };
 
 export const WithDelay = {
-  render: () => <AComponent thing={() => {}}>{isChromatic() ? 'Chromatic' : 'Second'}</AComponent>,
-
+  render: () => (isChromatic() ? 'Chromatic' : 'Second'),
   parameters: { chromatic: { delay: 1000 } },
 };
 
 export const DisabledStory = {
-  render: () => <AComponent thing={() => {}}>Disabled story</AComponent>,
+  render: () => 'Disabled story',
   parameters: { chromatic: { disable: true } },
 };
-
-export const IgnoredElements = () => (
-  <div>
-    <img
-      alt=""
-      src="http://fpoimg.com/100x100?text=foozbar"
-      data-chromatic="ignore"
-      style={{ border: '2px solid orangered' }}
-    />
-    <img
-      alt=""
-      src="http://fpoimg.com/100x100?text=foozbar"
-      className="chromatic-ignore"
-      style={{ border: '2px solid orangered' }}
-    />
-    <img
-      alt=""
-      src="http://fpoimg.com/100x100?text=foozbar"
-      style={{ border: '2px solid green' }}
-    />
-  </div>
-);
-
-export const RightToLeftBody = () => {
-  React.useEffect(() => {
-    const { dir } = document.body;
-    document.body.dir = 'rtl';
-    return () => {
-      document.body.dir = dir;
-    };
-  }, []);
-  return <div>Content</div>;
-};
-
-export const RightToLeftContainer = () => {
-  return <div dir="rtl">Content</div>;
-};