Match-id-2b1e77c5a887fc2de431c501e17ea810bf3d6b3a

.cloudbuild/test.yml

@@ -13,7 +13,7 @@ env:
   resource:
     type: docker
     image: kweecr04.his.huawei.com:80/ecr-build-arm-gzkunpeng/euleros_v2r7spc522_x64_opmt_cs5.0_sz:v5.0
-    class: 4U8G
+    class: 8U16G
     mode: toolbox
   cache:
     - type: workspace

CHANGELOG.md

@@ -1,3 +1,12 @@
+## 0.0.50 (2023-05-23)
+- **core**: 解决IE11不兼容Symbol问题
+
+## 0.0.49 (2023-05-19)
+- **core**: 解决当组件被销毁，业务若异步（定时器）调用setState修改状态，可能出现路径错误问题。
+
+## 0.0.48 (2023-05-18)
+- **core**: 解决style中属性WebkitLineClamp值被转换成字符串问题
+
 ## 0.0.45 (2023-05-10)
 - **core**: 修改belongClassVNode属性为Symbol提升性能
 - **core**: 优化内部循环实现，提升性能
@@ -16,12 +25,12 @@
 - **core**: 增加jsx-dev-runtime文件，给vite使用
 
 ## 0.0.40 (2023-03-08)
-- **core**: #103 使用Memo、React.forwardRef包装组件后，defaultProps失效
+- **core**: #103 使用Memo、forwardRef包装组件后，defaultProps失效
 - **core**: #104 --max-segment-num的style无法使用
 - **core**: 状态管理器的优化
 
 ## 0.0.39 (2023-02-21)
-- **core**: #102 使用eview-react组件Dialog时，关闭组件horizon报错，且无法再打开弹框
+- **core**: #102 使用eview组件Dialog时，关闭组件horizon报错，且无法再打开弹框
 
 ## 0.0.38 (2023-02-01)
 - **core**: 增加flushSync接口
@@ -55,7 +64,7 @@
 - **core**: fix 修改IE上报Symbol错误的问题
 
 ## 0.0.23 (2022-09-23)
-- **core**: #86 兼容ReactIs API
+- **core**: #86 兼容Is API
 
 ## 0.0.22 (2022-09-22)
 - **core**: #83 #75 #72 input支持受控

libs/horizon/package.json

@@ -4,7 +4,7 @@
   "keywords": [
     "horizon"
   ],
-  "version": "0.0.45",
+  "version": "0.0.50",
   "homepage": "",
   "bugs": "",
   "main": "index.js",

libs/horizon/src/dom/DOMOperator.ts

@@ -141,7 +141,7 @@ export function newTextDom(text: string, processing: VNode): Text {
   return textNode;
 }
 
-// 提交vNode的类型为Component或者Text的更新
+// 提交vNode的类型为DomComponent或者DomText的更新
 export function submitDomUpdate(tag: string, vNode: VNode) {
   const newProps = vNode.props;
   const element: Element | null = vNode.realNode;

libs/horizon/src/dom/DOMPropertiesHandler/StyleHandler.ts

@@ -33,6 +33,17 @@ const noUnitCSS = [
   'zoom',
 ];
 
+const length = noUnitCSS.length;
+for (let i = 0; i < length; i++) {
+  const cssKey = noUnitCSS[i];
+  const attributeKey =  cssKey.charAt(0).toUpperCase() + cssKey.slice(1);
+
+  // css 兼容性前缀 webkit: chrome, mo: IE或者Edge, Moz: 火狐
+  noUnitCSS.push('Webkit' + attributeKey);
+  noUnitCSS.push('mo' + attributeKey);
+  noUnitCSS.push('Moz' + attributeKey);
+}
+
 function isNeedUnitCSS(styleName: string) {
   return !(
     noUnitCSS.includes(styleName) ||
@@ -78,6 +89,7 @@ export function setStyles(dom, styles) {
     if (name.indexOf('--') === 0) {
       style.setProperty(name, styleVal);
     } else {
+      // 使用这种赋值方式，浏览器可以将'WebkitLineClamp'， 'backgroundColor'分别识别为'-webkit-line-clamp'和'backgroud-color'
       style[name] = adjustStyleValue(name, styleVal);
     }
   });

libs/horizon/src/dom/validators/ValidateProps.ts

@@ -98,7 +98,7 @@ export function validateProps(type, props) {
     return;
   }
 
-  // 非内置的变迁
+  // 非内置的元素
   if (!isNativeElement(type, props)) {
     return;
   }

libs/horizon/src/external/JSXElement.ts

@@ -40,6 +40,14 @@ export function JSXElement(type, key, ref, vNode, props, source: Source | null)
     // 所属的class组件,clonedeep jsxElement时需要防止无限循环
     [BELONG_CLASS_VNODE_KEY]: vNode,
   };
+  // 兼容IE11不支持Symbol
+  if (typeof BELONG_CLASS_VNODE_KEY  === 'string') {
+    Object.defineProperty(ele, BELONG_CLASS_VNODE_KEY, {
+      configurable: false,
+      enumerable: false,
+      value: vNode,
+    });
+  }
   if (isDev) {
     // 为了test判断两个 JSXElement 对象是否相等时忽略src属性，需要设置src的enumerable为false
     Object.defineProperty(ele, 'src', {

libs/horizon/src/renderer/TreeBuilder.ts

@@ -179,6 +179,11 @@ function isEqualByIndex(idx: number, pathArrays: string[][]) {
 function getChildByIndex(vNode: VNode, idx: number) {
   let node = vNode.child;
   for (let i = 0; i < idx; i++) {
+    // 场景：当组件被销毁，业务若异步（定时器）调用setState修改状态，可能出现路径错误，此处进行保护。
+    if (node == null) {
+      return null;
+    }
+
     node = node.next;
   }
   return node;

libs/horizon/src/renderer/components/BaseClassComponent.ts

@@ -33,7 +33,7 @@ class Component<P, S, C> {
 
   setState(state: S, callback?: Callback) {
     if (isDev) {
-      console.error('Cant not call `this.setState` in the constructor of class component, it will do nothing');
+      console.error('Can not call `this.setState` in the constructor of class component, it will do nothing');
     }
   }
 }

libs/horizon/src/renderer/vnode/VNode.ts

@@ -38,7 +38,7 @@ import type { Hook } from '../hooks/HookType';
 import { InitFlag } from './VNodeFlags';
 import { Observer } from '../../horizonx/proxy/Observer';
 
-export const BELONG_CLASS_VNODE_KEY = Symbol('belongClassVNode');
+export const BELONG_CLASS_VNODE_KEY = typeof Symbol === 'function' ? Symbol('belongClassVNode') : 'belongClassVNode';
 
 export class VNode {
   tag: VNodeTag;

scripts/__tests__/DomTest/Attribute.test.js

@@ -83,6 +83,12 @@ describe('Dom Attribute', () => {
       expect(window.getComputedStyle(div).getPropertyValue('height')).toBe('20px');
     });
 
+    it('WebkitLineClamp和lineClamp样式不会把数字转换成字符串或者追加"px"', () => {
+      Horizon.render(<div id={'div'} style={{ WebkitLineClamp: 2 }} />, container);
+      // 浏览器可以将WebkitLineClamp识别为-webkit-line-clamp,测试框架不可以
+      expect(container.querySelector('div').style.WebkitLineClamp).toBe(2);
+    });
+
     it('空字符串做属性名', () => {
       const emptyStringProps = { '': '' };
       expect(() => {