@builder.io/mitosis 0.0.56-32 → 0.0.56-34

package/dist/src/__tests__/angular.test.js

@@ -1,7 +1,18 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 var angular_1 = require("../generators/angular");
-var shared_1 = require("./shared");
+var jsx_1 = require("../parsers/jsx");
+var onUpdate = require('./data/blocks/onUpdate.raw');
+var slot = require('./data/blocks/slot.raw');
 describe('Angular', function () {
-    (0, shared_1.runTestsForTarget)('angular', (0, angular_1.componentToAngular)());
+    test('onUpdate', function () {
+        var component = (0, jsx_1.parseJsx)(onUpdate);
+        var output = (0, angular_1.componentToAngular)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
+    test('ng-content', function () {
+        var component = (0, jsx_1.parseJsx)(slot);
+        var output = (0, angular_1.componentToAngular)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
 });

package/dist/src/__tests__/builder.test.js

@@ -160,7 +160,7 @@ describe('Builder', function () {
         });
     }); });
     test('Regenerate Image', function () {
-        var code = (0, dedent_1.default)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n      import { useStore } from \"@builder.io/mitosis\";\n      import { Image } from \"@components\";\n\n      export default function MyComponent(props) {\n        const state = useStore({ people: [\"Steve\", \"Sewell\"] });\n\n        return (\n          <div\n            css={{\n              padding: \"20px\",\n            }}\n          >\n            <Image\n              image=\"https://cdn.builder.io/api/v1/image/foobar\"\n              sizes=\"100vw\"\n              backgroundSize=\"contain\"\n              css={{\n                marignTop: \"50px\",\n                display: \"block\",\n              }}\n            />\n          </div>\n        );\n      }\n    "], ["\n      import { useStore } from \"@builder.io/mitosis\";\n      import { Image } from \"@components\";\n\n      export default function MyComponent(props) {\n        const state = useStore({ people: [\"Steve\", \"Sewell\"] });\n\n        return (\n          <div\n            css={{\n              padding: \"20px\",\n            }}\n          >\n            <Image\n              image=\"https://cdn.builder.io/api/v1/image/foobar\"\n              sizes=\"100vw\"\n              backgroundSize=\"contain\"\n              css={{\n                marignTop: \"50px\",\n                display: \"block\",\n              }}\n            />\n          </div>\n        );\n      }\n    "])));
+        var code = (0, dedent_1.default)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n      import { useState } from \"@builder.io/mitosis\";\n      import { Image } from \"@components\";\n\n      export default function MyComponent(props) {\n        const state = useState({ people: [\"Steve\", \"Sewell\"] });\n\n        return (\n          <div\n            css={{\n              padding: \"20px\",\n            }}\n          >\n            <Image\n              image=\"https://cdn.builder.io/api/v1/image/foobar\"\n              sizes=\"100vw\"\n              backgroundSize=\"contain\"\n              css={{\n                marignTop: \"50px\",\n                display: \"block\",\n              }}\n            />\n          </div>\n        );\n      }\n    "], ["\n      import { useState } from \"@builder.io/mitosis\";\n      import { Image } from \"@components\";\n\n      export default function MyComponent(props) {\n        const state = useState({ people: [\"Steve\", \"Sewell\"] });\n\n        return (\n          <div\n            css={{\n              padding: \"20px\",\n            }}\n          >\n            <Image\n              image=\"https://cdn.builder.io/api/v1/image/foobar\"\n              sizes=\"100vw\"\n              backgroundSize=\"contain\"\n              css={{\n                marignTop: \"50px\",\n                display: \"block\",\n              }}\n            />\n          </div>\n        );\n      }\n    "])));
         var component = (0, jsx_1.parseJsx)(code);
         var builderJson = (0, builder_1.componentToBuilder)()({ component: component });
         var backToMitosis = (0, builder_2.builderContentToMitosisComponent)(builderJson);
@@ -174,7 +174,7 @@ describe('Builder', function () {
         expect(react).toMatchSnapshot();
     });
     test('Regenerate Text', function () {
-        var code = (0, dedent_1.default)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n      import { useStore } from \"@builder.io/mitosis\";\n\n      export default function MyComponent(props) {\n        const state = useStore({ people: [\"Steve\", \"Sewell\"] });\n\n        return (\n          <div\n            css={{\n              padding: \"20px\",\n            }}\n          >\n            <h2\n              css={{\n                marginBottom: \"20px\",\n              }}\n            >\n              Hello!\n            </h2>\n          </div>\n        );\n      }\n    "], ["\n      import { useStore } from \"@builder.io/mitosis\";\n\n      export default function MyComponent(props) {\n        const state = useStore({ people: [\"Steve\", \"Sewell\"] });\n\n        return (\n          <div\n            css={{\n              padding: \"20px\",\n            }}\n          >\n            <h2\n              css={{\n                marginBottom: \"20px\",\n              }}\n            >\n              Hello!\n            </h2>\n          </div>\n        );\n      }\n    "])));
+        var code = (0, dedent_1.default)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n      import { useState } from \"@builder.io/mitosis\";\n\n      export default function MyComponent(props) {\n        const state = useState({ people: [\"Steve\", \"Sewell\"] });\n\n        return (\n          <div\n            css={{\n              padding: \"20px\",\n            }}\n          >\n            <h2\n              css={{\n                marginBottom: \"20px\",\n              }}\n            >\n              Hello!\n            </h2>\n          </div>\n        );\n      }\n    "], ["\n      import { useState } from \"@builder.io/mitosis\";\n\n      export default function MyComponent(props) {\n        const state = useState({ people: [\"Steve\", \"Sewell\"] });\n\n        return (\n          <div\n            css={{\n              padding: \"20px\",\n            }}\n          >\n            <h2\n              css={{\n                marginBottom: \"20px\",\n              }}\n            >\n              Hello!\n            </h2>\n          </div>\n        );\n      }\n    "])));
         var component = (0, jsx_1.parseJsx)(code);
         var builderJson = (0, builder_1.componentToBuilder)()({ component: component });
         var backToMitosis = (0, builder_2.builderContentToMitosisComponent)(builderJson);
@@ -184,7 +184,7 @@ describe('Builder', function () {
         expect(mitosis.trim()).toEqual(code.trim());
     });
     test('Regenerate loop', function () {
-        var code = (0, dedent_1.default)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n      import { useStore, For } from \"@builder.io/mitosis\";\n\n      export default function MyComponent(props) {\n        const state = useStore({ people: [\"Steve\", \"Sewell\"] });\n\n        return (\n          <For each={state.people}>\n            {(person, index) => (\n              <div\n                key={person}\n                css={{\n                  padding: \"10px 0\",\n                }}\n              >\n                <span>{person}</span>\n                <span>{index}</span>\n              </div>\n            )}\n          </For>\n        );\n      }\n    "], ["\n      import { useStore, For } from \"@builder.io/mitosis\";\n\n      export default function MyComponent(props) {\n        const state = useStore({ people: [\"Steve\", \"Sewell\"] });\n\n        return (\n          <For each={state.people}>\n            {(person, index) => (\n              <div\n                key={person}\n                css={{\n                  padding: \"10px 0\",\n                }}\n              >\n                <span>{person}</span>\n                <span>{index}</span>\n              </div>\n            )}\n          </For>\n        );\n      }\n    "])));
+        var code = (0, dedent_1.default)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n      import { useState, For } from \"@builder.io/mitosis\";\n\n      export default function MyComponent(props) {\n        const state = useState({ people: [\"Steve\", \"Sewell\"] });\n\n        return (\n          <For each={state.people}>\n            {(person, index) => (\n              <div\n                key={person}\n                css={{\n                  padding: \"10px 0\",\n                }}\n              >\n                <span>{person}</span>\n                <span>{index}</span>\n              </div>\n            )}\n          </For>\n        );\n      }\n    "], ["\n      import { useState, For } from \"@builder.io/mitosis\";\n\n      export default function MyComponent(props) {\n        const state = useState({ people: [\"Steve\", \"Sewell\"] });\n\n        return (\n          <For each={state.people}>\n            {(person, index) => (\n              <div\n                key={person}\n                css={{\n                  padding: \"10px 0\",\n                }}\n              >\n                <span>{person}</span>\n                <span>{index}</span>\n              </div>\n            )}\n          </For>\n        );\n      }\n    "])));
         var component = (0, jsx_1.parseJsx)(code);
         var builderJson = (0, builder_1.componentToBuilder)()({ component: component });
         var backToMitosis = (0, builder_2.builderContentToMitosisComponent)(builderJson);

package/dist/src/__tests__/data/basic-onUpdate-deps.raw.d.ts

@@ -0,0 +1,4 @@
+export interface Props {
+    name: string;
+}
+export default function MyBasicComponent(props: Props): JSX.Element;

package/dist/src/__tests__/data/basic-onUpdate-deps.raw.jsx

@@ -0,0 +1,25 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var mitosis_1 = require("@builder.io/mitosis");
+function MyBasicComponent(props) {
+    var state = (0, mitosis_1.useStore)({
+        name: 'Steve',
+    });
+    (0, mitosis_1.onUpdate)(function () {
+        console.log('name 1');
+        if (state.name === 'Steve') {
+            state.name = 'PatrickJS';
+        }
+    }, [state.name]);
+    (0, mitosis_1.onUpdate)(function () {
+        console.log('name 2');
+        if (state.name === 'PatrickJS') {
+            state.name = 'Hi';
+        }
+    }, [props.name]);
+    return (<div>
+      <input value={state.name} onChange={function (myEvent) { return (state.name = myEvent.target.value); }}/>
+      Hello! I can run in React, Vue, Solid, or Liquid!
+    </div>);
+}
+exports.default = MyBasicComponent;

package/dist/src/__tests__/data/blocks/slot.raw.d.ts

@@ -0,0 +1,5 @@
+declare type Props = {
+    [key: string]: string;
+};
+export default function SlotCode(props: Props): JSX.Element;
+export {};

package/dist/src/__tests__/data/blocks/slot.raw.jsx

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+function SlotCode(props) {
+    return <div>{props.children}</div>;
+}
+exports.default = SlotCode;

package/dist/src/__tests__/html.test.js

@@ -1,7 +1,18 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 var html_1 = require("../generators/html");
-var shared_1 = require("./shared");
+var jsx_1 = require("../parsers/jsx");
+var stamped = require('./data/blocks/stamped-io.raw');
+var shadowDom = require('./data/blocks/shadow-dom.raw');
 describe('Html', function () {
-    (0, shared_1.runTestsForTarget)('html', (0, html_1.componentToHtml)());
+    test('Stamped', function () {
+        var component = (0, jsx_1.parseJsx)(stamped);
+        var html = (0, html_1.componentToHtml)()({ component: component });
+        expect(html).toMatchSnapshot();
+    });
+    test('Shadow DOM', function () {
+        var component = (0, jsx_1.parseJsx)(shadowDom);
+        var html = (0, html_1.componentToHtml)()({ component: component });
+        expect(html).toMatchSnapshot();
+    });
 });

package/dist/src/__tests__/liquid.test.js

@@ -1,7 +1,108 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 var liquid_1 = require("../generators/liquid");
-var shared_1 = require("./shared");
+var jsx_1 = require("../parsers/jsx");
+var basic = require('./data/basic.raw');
+var submitButtonBlock = require('./data/blocks/submit-button.raw');
+var inputBlock = require('./data/blocks/input.raw');
+var selectBlock = require('./data/blocks/select.raw');
+var formBlock = require('./data/blocks/form.raw');
+var button = require('./data/blocks/button.raw');
+var textarea = require('./data/blocks/textarea.raw');
+var img = require('./data/blocks/img.raw');
+var video = require('./data/blocks/video.raw');
+var section = require('./data/blocks/section.raw');
+var text = require('./data/blocks/text.raw');
+var rawText = require('./data/blocks/raw-text.raw');
+var customCode = require('./data/blocks/custom-code.raw');
+var stamped = require('./data/blocks/stamped-io.raw');
+var embed = require('./data/blocks/embed.raw');
+var image = require('./data/blocks/image.raw');
+var columns = require('./data/blocks/columns.raw');
 describe('Liquid', function () {
-    (0, shared_1.runTestsForTarget)('liquid', (0, liquid_1.componentToLiquid)());
+    test('Basic', function () {
+        var component = (0, jsx_1.parseJsx)(basic);
+        var output = (0, liquid_1.componentToLiquid)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
+    test('Input block', function () {
+        var component = (0, jsx_1.parseJsx)(inputBlock);
+        var output = (0, liquid_1.componentToLiquid)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
+    test('Submit button block', function () {
+        var component = (0, jsx_1.parseJsx)(submitButtonBlock);
+        var output = (0, liquid_1.componentToLiquid)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
+    test('Select block', function () {
+        var component = (0, jsx_1.parseJsx)(selectBlock);
+        var output = (0, liquid_1.componentToLiquid)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
+    test('Form block', function () {
+        var component = (0, jsx_1.parseJsx)(formBlock);
+        var output = (0, liquid_1.componentToLiquid)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
+    test('Button', function () {
+        var component = (0, jsx_1.parseJsx)(button);
+        var output = (0, liquid_1.componentToLiquid)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
+    test('Textarea', function () {
+        var component = (0, jsx_1.parseJsx)(textarea);
+        var output = (0, liquid_1.componentToLiquid)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
+    test('Img', function () {
+        var component = (0, jsx_1.parseJsx)(img);
+        var output = (0, liquid_1.componentToLiquid)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
+    test('Video', function () {
+        var component = (0, jsx_1.parseJsx)(video);
+        var output = (0, liquid_1.componentToLiquid)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
+    test('Section', function () {
+        var component = (0, jsx_1.parseJsx)(section);
+        var output = (0, liquid_1.componentToLiquid)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
+    test('Text', function () {
+        var component = (0, jsx_1.parseJsx)(text);
+        var output = (0, liquid_1.componentToLiquid)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
+    test('RawText', function () {
+        var component = (0, jsx_1.parseJsx)(rawText);
+        var output = (0, liquid_1.componentToLiquid)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
+    test('Stamped.io', function () {
+        var component = (0, jsx_1.parseJsx)(stamped);
+        var output = (0, liquid_1.componentToLiquid)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
+    test('CustomCode', function () {
+        var component = (0, jsx_1.parseJsx)(customCode);
+        var output = (0, liquid_1.componentToLiquid)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
+    test('Embed', function () {
+        var component = (0, jsx_1.parseJsx)(customCode);
+        var output = (0, liquid_1.componentToLiquid)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
+    test('Image', function () {
+        var component = (0, jsx_1.parseJsx)(image);
+        var output = (0, liquid_1.componentToLiquid)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
+    test('Columns', function () {
+        var component = (0, jsx_1.parseJsx)(columns);
+        var output = (0, liquid_1.componentToLiquid)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
 });

package/dist/src/__tests__/parse-jsx.test.js

@@ -3,11 +3,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 var jsx_1 = require("../parsers/jsx");
 var buttonWithMetadata = require('./data/blocks/button-with-metadata.raw');
 var image = require('./data/blocks/image.raw');
-var basicOnUpdateReturn = require('./data/basic-onUpdate-return.raw');
-var basicMitosis = require('./data/basic-custom-mitosis-package.raw');
-var basicRef = require('./data/basic-ref.raw');
-var basicPropsRaw = require('./data/basic-props.raw');
-var basicPropsDestructureRaw = require('./data/basic-props-destructure.raw');
 describe('Parse JSX', function () {
     test('metadata', function () {
         var json = (0, jsx_1.parseJsx)(buttonWithMetadata);
@@ -17,21 +12,4 @@ describe('Parse JSX', function () {
         var json = (0, jsx_1.parseJsx)(image);
         expect(json).toMatchSnapshot();
     });
-    test('onUpdate return', function () {
-        var json = (0, jsx_1.parseJsx)(basicOnUpdateReturn);
-        expect(json).toMatchSnapshot();
-    });
-    test('useRef', function () {
-        var json = (0, jsx_1.parseJsx)(basicRef);
-        expect(json).toMatchSnapshot();
-    });
-    test('custom mitosis package', function () {
-        var json = (0, jsx_1.parseJsx)(basicMitosis, {
-            compileAwayPackages: ['@dummy/custom-mitosis'],
-        });
-        expect(json).toMatchSnapshot();
-    });
-    test('custom mitosis package', function () {
-        expect((0, jsx_1.parseJsx)(basicPropsRaw)).toEqual((0, jsx_1.parseJsx)(basicPropsDestructureRaw));
-    });
 });

package/dist/src/__tests__/qwik.directive.test.js

@@ -103,6 +103,5 @@ function srcSet(url, additionalSizes) {
         parsedUrl.searchParams.set('width', size);
         return "".concat(parsedUrl, " ").concat(size, "w");
     })
-        .concat([url.replace('?format=webp', '')])
         .join(', ');
 }

package/dist/src/__tests__/qwik.test.js

@@ -38,13 +38,12 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
 Object.defineProperty(exports, "__esModule", { value: true });
 var fs_extra_promise_1 = require("fs-extra-promise");
 var qwik_1 = require("../generators/qwik");
-var component_generator_1 = require("../generators/qwik/component-generator");
 var index_1 = require("../generators/qwik/index");
+var src_generator_1 = require("../generators/qwik/src-generator");
 var builder_1 = require("../parsers/builder");
 var jsx_1 = require("../parsers/jsx");
 var compile_away_builder_components_1 = require("../plugins/compile-away-builder-components");
 var symbol_processor_1 = require("../symbols/symbol-processor");
-var shared_1 = require("./shared");
 var todo = require('../../../../examples/todo/src/components/todo.lite');
 var todos = require('../../../../examples/todo/src/components/todos.lite');
 var debugFiles = true;
@@ -77,7 +76,6 @@ var debugOutput = function (fileSet) { return __awaiter(void 0, void 0, void 0,
     });
 }); };
 describe('qwik', function () {
-    (0, shared_1.runTestsForTarget)('qwik', (0, component_generator_1.componentToQwik)());
     describe('todo', function () {
         test('Todo.tsx', function () { return __awaiter(void 0, void 0, void 0, function () {
             var json, fileSet;
@@ -311,7 +309,8 @@ describe('qwik', function () {
                         fileSet = (0, index_1.createFileSet)({ output: 'mjs', jsx: true });
                         hierarchy.depthFirstSymbols.forEach(function (builderComponent) {
                             var mitosisComponent = (0, symbol_processor_1.convertBuilderElementToMitosisComponent)(builderComponent);
-                            mitosisComponent && (0, index_1.addComponent)(fileSet, mitosisComponent, { isRoot: false });
+                            mitosisComponent &&
+                                (0, index_1.addComponent)(fileSet, mitosisComponent, { isRoot: false });
                         });
                         component = (0, builder_1.builderContentToMitosisComponent)(content, {
                             includeBuilderExtras: true,
@@ -373,49 +372,13 @@ describe('qwik', function () {
         });
     }); });
     test('bindings', function () { return __awaiter(void 0, void 0, void 0, function () {
-        var content, fileSet, component;
+        var content, state, fileSet, component;
         return __generator(this, function (_a) {
             switch (_a.label) {
                 case 0:
                     content = require('./qwik.test.bindings.json');
-                    fileSet = (0, index_1.createFileSet)({ output: 'cjs', jsx: false });
-                    component = (0, builder_1.builderContentToMitosisComponent)(content, {
-                        includeBuilderExtras: true,
-                        preserveTextBlocks: true,
-                    });
-                    (0, compile_away_builder_components_1.compileAwayBuilderComponentsFromTree)(component, compile_away_builder_components_1.components);
-                    (0, index_1.addComponent)(fileSet, component);
-                    return [4 /*yield*/, debugOutput(fileSet)];
-                case 1:
-                    _a.sent();
-                    expect(toObj(fileSet)).toMatchSnapshot();
-                    return [2 /*return*/];
-            }
-        });
-    }); });
-    test('for-loop.bindings', function () { return __awaiter(void 0, void 0, void 0, function () {
-        var component, fileSet;
-        return __generator(this, function (_a) {
-            switch (_a.label) {
-                case 0:
-                    component = require('./qwik.test.for-loop.binding.json');
-                    fileSet = (0, index_1.createFileSet)({ output: 'cjs', jsx: false });
-                    (0, compile_away_builder_components_1.compileAwayBuilderComponentsFromTree)(component, compile_away_builder_components_1.components);
-                    (0, index_1.addComponent)(fileSet, component);
-                    return [4 /*yield*/, debugOutput(fileSet)];
-                case 1:
-                    _a.sent();
-                    expect(toObj(fileSet)).toMatchSnapshot();
-                    return [2 /*return*/];
-            }
-        });
-    }); });
-    test('mount', function () { return __awaiter(void 0, void 0, void 0, function () {
-        var content, fileSet, component;
-        return __generator(this, function (_a) {
-            switch (_a.label) {
-                case 0:
-                    content = require('./qwik.test.mount.json');
+                    state = {};
+                    expect(state).toMatchSnapshot();
                     fileSet = (0, index_1.createFileSet)({ output: 'cjs', jsx: false });
                     component = (0, builder_1.builderContentToMitosisComponent)(content, {
                         includeBuilderExtras: true,
@@ -432,24 +395,30 @@ describe('qwik', function () {
         });
     }); });
     describe('src-generator', function () {
-        var file;
-        beforeEach(function () {
-            return (file = new qwik_1.File('test.js', {
+        test('should format code', function () {
+            var file = new qwik_1.File('test.js', {
                 isPretty: true,
                 isTypeScript: false,
                 isJSX: true,
                 isModule: true,
-                isBuilder: true,
-            }, '', ''));
-        });
-        test('should format code', function () {
+            }, '', '');
             file.src.emit('const x=1');
             expect(file.toString()).toEqual('const x = 1;\n');
         });
-        test('should deal with empty bindings', function () {
-            file.src.jsxBegin('Image', {}, { image: '' });
-            file.src.jsxEnd('Image');
-            expect(file.toString()).toEqual('<Image></Image>;\n');
+    });
+    describe('helper functions', function () {
+        describe('isStatement', function () {
+            test('is an expression', function () {
+                expect((0, src_generator_1.isStatement)('a.b')).toBe(false);
+                expect((0, src_generator_1.isStatement)('1?2:"bar"')).toBe(false);
+                expect((0, src_generator_1.isStatement)('"var x; return foo + \'\\"\';"')).toBe(false);
+                expect((0, src_generator_1.isStatement)('"foo" + `bar\nbaz`')).toBe(false);
+                expect((0, src_generator_1.isStatement)('(...)()')).toBe(false);
+            });
+            test('is a statement', function () {
+                expect((0, src_generator_1.isStatement)('var x; return x;')).toBe(true);
+                expect((0, src_generator_1.isStatement)('var x')).toBe(true);
+            });
         });
     });
 });

package/dist/src/__tests__/react-native.test.js

@@ -1,7 +1,140 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 var react_native_1 = require("../generators/react-native");
-var shared_1 = require("./shared");
-describe('React Native', function () {
-    (0, shared_1.runTestsForTarget)('reactNative', (0, react_native_1.componentToReactNative)());
+var jsx_1 = require("../parsers/jsx");
+var basic = require('./data/basic.raw');
+var submitButtonBlock = require('./data/blocks/submit-button.raw');
+var inputBlock = require('./data/blocks/input.raw');
+var selectBlock = require('./data/blocks/select.raw');
+var formBlock = require('./data/blocks/form.raw');
+var button = require('./data/blocks/button.raw');
+var textarea = require('./data/blocks/textarea.raw');
+var img = require('./data/blocks/img.raw');
+var video = require('./data/blocks/video.raw');
+var section = require('./data/blocks/section.raw');
+var text = require('./data/blocks/text.raw');
+var rawText = require('./data/blocks/raw-text.raw');
+var stamped = require('./data/blocks/stamped-io.raw');
+var customCode = require('./data/blocks/custom-code.raw');
+var embed = require('./data/blocks/embed.raw');
+var image = require('./data/blocks/image.raw');
+var columns = require('./data/blocks/columns.raw');
+var onUpdate = require('./data/blocks/onUpdate.raw');
+var onUpdateWithDeps = require('./data/blocks/onUpdateWithDeps.raw');
+var multipleOnUpdate = require('./data/blocks/multiple-onUpdate.raw');
+var multipleOnUpdateWithDeps = require('./data/blocks/multiple-onUpdateWithDeps.raw');
+var onMount = require('./data/blocks/onMount.raw');
+describe('React', function () {
+    test('Basic', function () {
+        var component = (0, jsx_1.parseJsx)(basic);
+        var output = (0, react_native_1.componentToReactNative)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
+    test('Input block', function () {
+        var component = (0, jsx_1.parseJsx)(inputBlock);
+        var output = (0, react_native_1.componentToReactNative)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
+    test('Submit button block', function () {
+        var component = (0, jsx_1.parseJsx)(submitButtonBlock);
+        var output = (0, react_native_1.componentToReactNative)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
+    test('Select block', function () {
+        var component = (0, jsx_1.parseJsx)(selectBlock);
+        var output = (0, react_native_1.componentToReactNative)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
+    test('Form block', function () {
+        var component = (0, jsx_1.parseJsx)(formBlock);
+        var output = (0, react_native_1.componentToReactNative)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
+    test('Button', function () {
+        var component = (0, jsx_1.parseJsx)(button);
+        var output = (0, react_native_1.componentToReactNative)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
+    test('Textarea', function () {
+        var component = (0, jsx_1.parseJsx)(textarea);
+        var output = (0, react_native_1.componentToReactNative)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
+    test('Img', function () {
+        var component = (0, jsx_1.parseJsx)(img);
+        var output = (0, react_native_1.componentToReactNative)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
+    test('Video', function () {
+        var component = (0, jsx_1.parseJsx)(video);
+        var output = (0, react_native_1.componentToReactNative)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
+    test('Section', function () {
+        var component = (0, jsx_1.parseJsx)(section);
+        var output = (0, react_native_1.componentToReactNative)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
+    test('Text', function () {
+        var component = (0, jsx_1.parseJsx)(text);
+        var output = (0, react_native_1.componentToReactNative)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
+    test('RawText', function () {
+        var component = (0, jsx_1.parseJsx)(rawText);
+        var output = (0, react_native_1.componentToReactNative)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
+    test('Stamped.io', function () {
+        var component = (0, jsx_1.parseJsx)(stamped);
+        var output = (0, react_native_1.componentToReactNative)({
+            stateType: 'useState',
+        })({ component: component });
+        expect(output).toMatchSnapshot();
+    });
+    test('CustomCode', function () {
+        var component = (0, jsx_1.parseJsx)(customCode);
+        var output = (0, react_native_1.componentToReactNative)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
+    test('Embed', function () {
+        var component = (0, jsx_1.parseJsx)(customCode);
+        var output = (0, react_native_1.componentToReactNative)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
+    test('Image', function () {
+        var component = (0, jsx_1.parseJsx)(image);
+        var output = (0, react_native_1.componentToReactNative)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
+    test('Columns', function () {
+        var component = (0, jsx_1.parseJsx)(columns);
+        var output = (0, react_native_1.componentToReactNative)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
+    test('onUpdate', function () {
+        var component = (0, jsx_1.parseJsx)(onUpdate);
+        var output = (0, react_native_1.componentToReactNative)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
+    test('onUpdateWithDeps', function () {
+        var component = (0, jsx_1.parseJsx)(onUpdateWithDeps);
+        var output = (0, react_native_1.componentToReactNative)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
+    test('multipleOnUpdate', function () {
+        var component = (0, jsx_1.parseJsx)(multipleOnUpdate);
+        var output = (0, react_native_1.componentToReactNative)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
+    test('multipleOnnUpdateWithDeps', function () {
+        var component = (0, jsx_1.parseJsx)(multipleOnUpdateWithDeps);
+        var output = (0, react_native_1.componentToReactNative)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
+    test('onMount & onUnMount', function () {
+        var component = (0, jsx_1.parseJsx)(onMount);
+        var output = (0, react_native_1.componentToReactNative)()({ component: component });
+        expect(output).toMatchSnapshot();
+    });
 });