Match-id-3094031e84c24a0395983ee11c7babf90673d113

.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,6 @@
+## 0.0.48 (2023-05-18)
+- **core**: 解决style中属性WebkitLineClamp值被转换成字符串问题
+
 ## 0.0.45 (2023-05-10)
 - **core**: 修改belongClassVNode属性为Symbol提升性能
 - **core**: 优化内部循环实现，提升性能

libs/horizon/package.json

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

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);
     }
   });

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(() => {