Merge remote-tracking branch 'origin/v4' into requests

# Conflicts:
#	.pnp.cjs
#	packages/server/package.json

.deepsource.toml

@@ -31,6 +31,7 @@ enabled = true
     "packages/blocks/blocksColorSelectors/package.json",
     "packages/blocks/blocksECharts/package.json",
     "packages/blocks/blocksMarkdown/package.json",
+    "packages/blockDev/package.json",
     "packages/blockTools/package.json",
     "packages/build/package.json",
     "packages/cli/package.json",

packages/ajv/package.json

@@ -47,8 +47,8 @@
     "@babel/core": "7.15.8",
     "@babel/preset-env": "7.15.8",
     "babel-jest": "27.3.1",
-    "jest": "26.6.3",
-    "jest-diff": "26.6.2"
+    "jest": "27.3.1",
+    "jest-diff": "27.3.1"
   },
   "publishConfig": {
     "access": "public"

packages/api/package.json

@@ -53,7 +53,7 @@
     "babel-jest": "27.3.1",
     "babel-loader": "8.2.3",
     "clean-webpack-plugin": "4.0.0",
-    "jest": "26.6.3",
+    "jest": "27.3.1",
     "webpack": "5.59.1",
     "webpack-cli": "4.9.1"
   },

packages/blockDev/.babelrc

@@ -0,0 +1,14 @@
+{
+  "presets": [
+    [
+      "@babel/preset-env",
+      {
+        "targets": {
+          "node": "12",
+          "esmodules": true
+        }
+      }
+    ],
+    "@babel/preset-react"
+  ]
+}

packages/blockDev/jest.config.js

@@ -0,0 +1,15 @@
+module.exports = {
+  clearMocks: true,
+  collectCoverage: false,
+  errorOnDeprecated: true,
+  testEnvironment: 'jsdom',
+  testPathIgnorePatterns: ['<rootDir>/dist/'],
+  moduleFileExtensions: ['js', 'json', 'jsx', 'ts', 'tsx', 'node', 'yaml', 'css'],
+  moduleNameMapper: {
+    '\\.(css|less)$': '<rootDir>/tests/__mocks__/styleMock.js',
+  },
+  transform: {
+    '\\.js?$': 'babel-jest',
+    '\\.yaml$': 'jest-transform-yaml',
+  },
+};

packages/blockDev/package.json

@@ -0,0 +1,65 @@
+{
+  "name": "@lowdefy/block-dev",
+  "version": "3.22.0",
+  "licence": "Apache-2.0",
+  "description": "Lowdefy Block Development Tools",
+  "homepage": "https://lowdefy.com",
+  "keywords": [
+    "lowdefy",
+    "utils"
+  ],
+  "bugs": {
+    "url": "https://github.com/lowdefy/lowdefy/issues"
+  },
+  "contributors": [
+    {
+      "name": "Sam Tolmay",
+      "url": "https://github.com/SamTolmay"
+    },
+    {
+      "name": "Gerrie van Wyk",
+      "url": "https://github.com/Gervwyk"
+    }
+  ],
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/lowdefy/lowdefy.git"
+  },
+  "main": "dist/index.js",
+  "files": [
+    "dist/*"
+  ],
+  "scripts": {
+    "build": "babel src --copy-files --out-dir dist",
+    "clean": "rm -rf dist",
+    "prepare": "yarn build",
+    "test": "jest --coverage"
+  },
+  "dependencies": {
+    "@emotion/jest": "11.5.0",
+    "@lowdefy/block-tools": "3.22.0",
+    "@lowdefy/helpers": "3.22.0",
+    "@testing-library/dom": "8.10.1",
+    "@testing-library/react": "12.1.2",
+    "@testing-library/user-event": "13.5.0",
+    "ajv": "6.12.6",
+    "ajv-errors": "1.0.1",
+    "jest": "27.3.1",
+    "jest-serializer-html": "7.1.0",
+    "jest-transform-yaml": "0.1.2",
+    "react": "17.0.2",
+    "react-dom": "17.0.2",
+    "react-router": "5.2.1",
+    "yaml-loader": "0.6.0"
+  },
+  "devDependencies": {
+    "@babel/cli": "7.15.7",
+    "@babel/core": "7.15.8",
+    "@babel/preset-env": "7.15.8",
+    "@babel/preset-react": "7.14.5",
+    "babel-jest": "27.3.1"
+  },
+  "publishConfig": {
+    "access": "public"
+  }
+}

packages/blockTools/src/BlockSchemaErrors.test.js → packages/blockDev/src/BlockSchemaErrors.test.js

@@ -1,54 +1,37 @@
 import React from 'react';
+import { render } from '@testing-library/react';
+
 import BlockSchemaErrors from './BlockSchemaErrors';
-import { create, act } from 'react-test-renderer';
 
 test('default', () => {
-  let comp;
-  act(() => {
-    comp = create(<BlockSchemaErrors />);
-  });
-  expect(comp.toJSON()).toMatchInlineSnapshot(`""`);
-  act(() => {
-    comp = create(<BlockSchemaErrors schemaErrors={[]} />);
-  });
-  expect(comp.toJSON()).toMatchInlineSnapshot(`""`);
+  const { container } = render(<BlockSchemaErrors />);
+  expect(container.firstChild).toMatchInlineSnapshot(``);
 });
 
 test('with schema errors', () => {
-  let comp;
-  act(() => {
-    comp = create(
-      <BlockSchemaErrors
-        schemaErrors={[
-          {
-            keyword: 'keyword-one',
-            message: 'message-one',
-            params: { params: 'one' },
-            dataPath: 'dataPath-one',
-            schemaPath: 'schemaPath-one',
-          },
-          {
-            keyword: 'keyword-two',
-            message: 'message-twp',
-            params: { params: 'two' },
-            dataPath: 'dataPath-twp',
-            schemaPath: 'schemaPath-two',
-          },
-        ]}
-      />
-    );
-  });
-  expect(comp.toJSON()).toMatchInlineSnapshot(`
+  const { container } = render(
+    <BlockSchemaErrors
+      schemaErrors={[
+        {
+          keyword: 'keyword-one',
+          message: 'message-one',
+          params: { params: 'one' },
+          dataPath: 'dataPath-one',
+          schemaPath: 'schemaPath-one',
+        },
+        {
+          keyword: 'keyword-two',
+          message: 'message-twp',
+          params: { params: 'two' },
+          dataPath: 'dataPath-twp',
+          schemaPath: 'schemaPath-two',
+        },
+      ]}
+    />
+  );
+  expect(container.firstChild).toMatchInlineSnapshot(`
     <div
-      style={
-        Object {
-          "background": "#fBB",
-          "border": "1px solid red",
-          "fontSize": "0.8rem",
-          "padding": 10,
-          "width": "100%",
-        }
-      }
+      style="padding: 10px; font-size: 0.8rem; border: 1px solid red; background: rgb(255, 187, 187); width: 100%;"
     >
       <div>
         <b>

packages/blockDev/src/index.js

@@ -0,0 +1,33 @@
+/*
+  Copyright 2020-2021 Lowdefy, Inc
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+*/
+
+import BlockSchemaErrors from './BlockSchemaErrors';
+import mockBlock from './mockBlock';
+import runBlockSchemaTests from './runBlockSchemaTests';
+import runMockMethodTests from './runMockMethodTests';
+import runMockRenderTests from './runMockRenderTests';
+import runRenderTests from './runRenderTests';
+import stubBlockProps from './stubBlockProps';
+
+export {
+  BlockSchemaErrors,
+  mockBlock,
+  runBlockSchemaTests,
+  runMockMethodTests,
+  runMockRenderTests,
+  runRenderTests,
+  stubBlockProps,
+};

packages/blockTools/src/mockBlock.js → packages/blockDev/src/mockBlock.js

@@ -14,13 +14,14 @@
   limitations under the License.
 */
 
+import { makeCssClass } from '@lowdefy/block-tools';
+
 import stubBlockProps from './stubBlockProps';
 
 const mockBlock = ({ meta, logger }) => {
   const mockMath = Object.create(global.Math);
   mockMath.random = () => 0.5;
   global.Math = mockMath;
-  const makeCssClass = jest.fn();
   const moveItemDown = jest.fn();
   const moveItemUp = jest.fn();
   const pushItem = jest.fn();
@@ -42,11 +43,8 @@ const mockBlock = ({ meta, logger }) => {
     triggerEvent,
     unshiftItem,
   };
-  const makeCssImp = (style, op) => JSON.stringify({ style, options: op });
   const before = () => {
     triggerEvent.mockReset();
-    makeCssClass.mockReset();
-    makeCssClass.mockImplementation(makeCssImp);
     moveItemDown.mockReset();
     moveItemUp.mockReset();
     pushItem.mockReset();

packages/blockTools/src/runMockMethodTests.js → packages/blockDev/src/runMockMethodTests.js

@@ -16,10 +16,12 @@
 
 import React from 'react';
 import { type } from '@lowdefy/helpers';
+import { render, screen } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
 
 import mockBlock from './mockBlock';
 
-const runMockMethodTests = ({ Block, enzyme, examples, logger, meta, mocks }) => {
+const runMockMethodTests = ({ Block, examples, logger, meta, mocks }) => {
   const { before, methods, getProps } = mockBlock({ meta, logger });
 
   beforeEach(() => {
@@ -53,8 +55,9 @@ const runMockMethodTests = ({ Block, enzyme, examples, logger, meta, mocks }) =>
                   </>
                 );
               };
-              const wrapper = enzyme.mount(<Shell />);
-              wrapper.find('[data-testid="btn_method"]').simulate('click');
+              const { container } = render(<Shell />);
+              expect(container.firstChild).toMatchSnapshot();
+              userEvent.click(screen.getByTestId('btn_method'));
               expect(mock.fn.mock.calls).toMatchSnapshot();
             });
           });

packages/blockTools/src/runMockRenderTests.js → packages/blockDev/src/runMockRenderTests.js

@@ -16,24 +16,22 @@
 
 import React from 'react';
 import { type } from '@lowdefy/helpers';
-import { MemoryRouter } from 'react-router-dom';
+import { MemoryRouter } from 'react-router';
+import { render } from '@testing-library/react';
 
 import mockBlock from './mockBlock';
 
-const runMockRenderTests = ({
-  Block,
-  enzyme,
-  examples,
-  logger,
-  meta,
-  mocks,
-  reset = () => null,
-}) => {
-  const { before, methods, getProps } = mockBlock({ meta, logger });
+const runMockRenderTests = ({ Block, examples, logger, meta, mocks, reset = () => null }) => {
+  const { before, getProps } = mockBlock({ meta, logger });
+
+  const makeCssClass = jest.fn();
+  const makeCssImp = (style, op) => JSON.stringify({ style, options: op });
 
   beforeEach(() => {
     reset();
     before();
+    makeCssClass.mockReset();
+    makeCssClass.mockImplementation(makeCssImp);
   });
   const values = meta.values
     ? [type.enforceType(meta.valueType, null), ...meta.values]
@@ -45,15 +43,9 @@ const runMockRenderTests = ({
         test(`Mock render - ${ex.id} - value[${v}] - ${mock.name}`, () => {
           const Shell = () => {
             const props = getProps(ex);
-            return (
-              <Block
-                {...props}
-                methods={{ ...props.methods, makeCssClass: methods.makeCssClass }}
-                value={value}
-              />
-            );
+            return <Block {...props} methods={{ ...props.methods, makeCssClass }} value={value} />;
           };
-          enzyme.mount(
+          render(
             <MemoryRouter>
               <Shell />
             </MemoryRouter>