From b2e64b827381d19d18c2e7a50a85a2abdc00db7e Mon Sep 17 00:00:00 2001
From: Bowen Tan <bowen.tan@smartx.com>
Date: Thu, 7 Jul 2022 10:40:10 +0800
Subject: [PATCH] fix(validator): validator can not detect variable from
 dependencies in expression

---
 .../editor/__tests__/validator/component.spec.ts   |  9 ++++++++-
 packages/editor/__tests__/validator/mock.ts        | 14 ++++++++++++++
 packages/editor/src/services/EditorStore.ts        |  3 ++-
 packages/editor/src/validator/SchemaValidator.ts   |  3 ++-
 packages/editor/src/validator/interfaces.ts        |  1 +
 .../editor/src/validator/rules/PropertiesRules.ts  |  6 +++++-
 6 files changed, 32 insertions(+), 4 deletions(-)

diff --git a/packages/editor/__tests__/validator/component.spec.ts b/packages/editor/__tests__/validator/component.spec.ts
index b83148f3..a396e5dd 100644
--- a/packages/editor/__tests__/validator/component.spec.ts
+++ b/packages/editor/__tests__/validator/component.spec.ts
@@ -2,12 +2,13 @@ import {
   ComponentInvalidSchema,
   ComponentPropertyExpressionSchema,
   ComponentWrongPropertyExpressionSchema,
+  UseDependencyInExpressionSchema,
 } from './mock';
 import { SchemaValidator } from '../../src/validator';
 import { registry } from '../services';
 import { AppModel } from '../../src/AppModel/AppModel';
 
-const schemaValidator = new SchemaValidator(registry);
+const schemaValidator = new SchemaValidator(registry, ['foo']);
 
 describe('Validate component', () => {
   describe('validate component properties', () => {
@@ -47,5 +48,11 @@ describe('Validate component', () => {
         `Window object 'Math' does not have property 'random2'.`
       );
     });
+    it('allow using dependency in expression', () => {
+      const result2 = schemaValidator.validate(
+        new AppModel(UseDependencyInExpressionSchema, registry)
+      );
+      expect(result2.length).toBe(0);
+    });
   });
 });
diff --git a/packages/editor/__tests__/validator/mock.ts b/packages/editor/__tests__/validator/mock.ts
index 956c3a88..6d4b7b81 100644
--- a/packages/editor/__tests__/validator/mock.ts
+++ b/packages/editor/__tests__/validator/mock.ts
@@ -126,6 +126,20 @@ export const ComponentWrongPropertyExpressionSchema: ComponentSchema[] = [
   },
 ];
 
+export const UseDependencyInExpressionSchema: ComponentSchema[] = [
+  {
+    id: 'text1',
+    type: 'core/v1/text',
+    properties: {
+      value: {
+        raw: '{{foo}}',
+        format: 'plain',
+      },
+    },
+    traits: [],
+  },
+];
+
 export const TraitInvalidSchema: ComponentSchema[] = [
   {
     id: 'text1',
diff --git a/packages/editor/src/services/EditorStore.ts b/packages/editor/src/services/EditorStore.ts
index eade8075..a96393e7 100644
--- a/packages/editor/src/services/EditorStore.ts
+++ b/packages/editor/src/services/EditorStore.ts
@@ -63,7 +63,8 @@ export class EditorStore {
     private appModelManager: AppModelManager
   ) {
     this.globalDependencies = this.stateManager.dependencies;
-    this.schemaValidator = new SchemaValidator(this.registry);
+    const dependencyNames = Object.keys(this.globalDependencies);
+    this.schemaValidator = new SchemaValidator(this.registry, dependencyNames);
     makeAutoObservable(this, {
       eleMap: false,
       components: observable.shallow,
diff --git a/packages/editor/src/validator/SchemaValidator.ts b/packages/editor/src/validator/SchemaValidator.ts
index 60ca7f09..8e21e466 100644
--- a/packages/editor/src/validator/SchemaValidator.ts
+++ b/packages/editor/src/validator/SchemaValidator.ts
@@ -28,7 +28,7 @@ export class SchemaValidator implements ISchemaValidator {
   private ajv!: Ajv;
   private validatorMap!: ValidatorMap;
 
-  constructor(private registry: RegistryInterface) {
+  constructor(private registry: RegistryInterface, private dependencyNames?: string[]) {
     this.initAjv();
     this.addRules(rules);
   }
@@ -63,6 +63,7 @@ export class SchemaValidator implements ISchemaValidator {
       appModel,
       componentIdSpecMap: this.componentIdSpecMap,
       ajv: this.ajv,
+      dependencyNames: this.dependencyNames || [],
     };
     this.allComponentsRules.forEach(rule => {
       const r = rule.validate(baseContext);
diff --git a/packages/editor/src/validator/interfaces.ts b/packages/editor/src/validator/interfaces.ts
index 4b8b2e23..1a9023af 100644
--- a/packages/editor/src/validator/interfaces.ts
+++ b/packages/editor/src/validator/interfaces.ts
@@ -20,6 +20,7 @@ interface BaseValidateContext {
   registry: RegistryInterface;
   appModel: IAppModel;
   ajv: Ajv;
+  dependencyNames: string[];
   componentIdSpecMap: Record<string, RuntimeComponent<string, string, string, string>>;
 }
 
diff --git a/packages/editor/src/validator/rules/PropertiesRules.ts b/packages/editor/src/validator/rules/PropertiesRules.ts
index e366f42f..93188cf7 100644
--- a/packages/editor/src/validator/rules/PropertiesRules.ts
+++ b/packages/editor/src/validator/rules/PropertiesRules.ts
@@ -62,6 +62,7 @@ class ExpressionValidatorRule implements PropertiesValidatorRule {
     component,
     trait,
     appModel,
+    dependencyNames,
   }: PropertiesValidateContext): ValidateErrorResult[] {
     const results: ValidateErrorResult[] = [];
 
@@ -100,8 +101,11 @@ class ExpressionValidatorRule implements PropertiesValidatorRule {
         } else if (appModel.moduleIds.includes(id as ModuleId)) {
           // case 3: id is a module
           // TODO: check module stateMap
+        } else if (dependencyNames.includes(id)) {
+          // case 4: id is from dependency
+          // do nothing
         } else {
-          // case 4: id doesn't exist
+          // case 5: id doesn't exist
           results.push({
             message: `Cannot find '${id}' in store or window.`,
             componentId: component.id,