svg dashed props conversion improvements (#3615)

preactjs · Jul 15, 2022 · e960162 · e960162
1 parent dbe0fa8
commit e960162
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 3 deletions.
diff --git a/compat/src/render.js b/compat/src/render.js
@@ -10,7 +10,7 @@ export const REACT_ELEMENT_TYPE =
 	(typeof Symbol != 'undefined' && Symbol.for && Symbol.for('react.element')) ||
 	0xeac7;
 
-const CAMEL_PROPS = /^(?:accent|alignment|arabic|baseline|cap|clip(?!PathU)|color|dominant|fill|flood|font|glyph(?!R)|horiz|marker(?!H|W|U)|overline|paint|shape|stop|strikethrough|stroke|text(?!L)|underline|unicode|units|v|vector|vert|word|writing|x(?!C))[A-Z]/;
+const CAMEL_PROPS = /^(?:accent|alignment|arabic|baseline|cap|clip(?!PathU)|color|dominant|fill|flood|font|glyph(?!R)|horiz|image|letter|lighting|marker(?!H|W|U)|overline|paint|pointer|shape|stop|strikethrough|stroke|text(?!L)|transform|underline|unicode|units|v|vector|vert|word|writing|x(?!C))[A-Z]/;
 
 const IS_DOM = typeof document !== 'undefined';
 
@@ -156,7 +156,7 @@ options.vnode = vnode => {
 			} else if (/^on(Ani|Tra|Tou|BeforeInp|Compo)/.test(i)) {
 				i = i.toLowerCase();
 			} else if (nonCustomElement && CAMEL_PROPS.test(i)) {
-				i = i.replace(/[A-Z0-9]/, '-$&').toLowerCase();
+				i = i.replace(/[A-Z0-9]/g, '-$&').toLowerCase();
 			} else if (value === null) {
 				value = undefined;
 			}

diff --git a/compat/test/browser/svg.test.js b/compat/test/browser/svg.test.js
@@ -73,13 +73,22 @@ describe('svg', () => {
 				clipPath="value"
 				clipRule="value"
 				clipPathUnits="value"
+				colorInterpolationFilters="auto"
+				fontSizeAdjust="value"
 				glyphOrientationHorizontal="value"
+				glyphOrientationVertical="value"
 				shapeRendering="crispEdges"
 				glyphRef="value"
+				horizAdvX="value"
+				horizOriginX="value"
 				markerStart="value"
 				markerHeight="value"
 				markerUnits="value"
 				markerWidth="value"
+				unitsPerEm="value"
+				vertAdvY="value"
+				vertOriginX="value"
+				vertOriginY="value"
 				x1="value"
 				xChannelSelector="value"
 			/>,
@@ -88,7 +97,7 @@ describe('svg', () => {
 
 		expect(serializeHtml(scratch)).to.eql(
 			sortAttributes(
-				'<svg clip-path="value" clip-rule="value" clipPathUnits="value" glyph-orientationhorizontal="value" shape-rendering="crispEdges" glyphRef="value" marker-start="value" markerHeight="value" markerUnits="value" markerWidth="value" x1="value" xChannelSelector="value"></svg>'
+				'<svg clip-path="value" clip-rule="value" clipPathUnits="value" color-interpolation-filters="auto" font-size-adjust="value" glyph-orientation-horizontal="value" glyph-orientation-vertical="value" shape-rendering="crispEdges" glyphRef="value" horiz-adv-x="value" horiz-origin-x="value" marker-start="value" markerHeight="value" markerUnits="value" markerWidth="value" units-per-em="value" vert-adv-y="value" vert-origin-x="value" vert-origin-y="value" x1="value" xChannelSelector="value"></svg>'
 			)
 		);
 	});