@solidjs/web 2.0.0-rc.5 → 2.0.0-rc.6

package/dist/server.cjs

@@ -49,6 +49,15 @@ const Namespaces = {
 const VoidElements = /*#__PURE__*/new Set(["area", "base", "br", "col", "embed", "hr", "img", "input", "link", "meta", "param", "source", "track", "wbr"]);
 const RawTextElements = /*#__PURE__*/new Set(["style", "script", "noscript", "template", "textarea", "title"]);
 const DOMElements = /*#__PURE__*/new Set(/*#__PURE__*/"a,abbr,acronym,address,applet,area,article,aside,audio,b,base,basefont,bdi,bdo,bgsound,big,blink,blockquote,body,br,button,canvas,caption,center,cite,code,col,colgroup,content,data,datalist,dd,del,details,dfn,dialog,dir,div,dl,dt,em,embed,fieldset,figcaption,figure,font,footer,form,frame,frameset,h1,h2,h3,h4,h5,h6,head,header,hgroup,hr,html,i,iframe,image,img,input,ins,isindex,kbd,keygen,label,legend,li,link,listing,main,map,mark,marquee,math,menu,menuitem,meta,meter,multicol,nav,nextid,nobr,noembed,noframes,noindex,noscript,object,ol,optgroup,option,output,p,param,picture,plaintext,portal,pre,progress,q,rb,rp,rt,rtc,ruby,s,samp,script,search,section,select,shadow,slot,small,source,spacer,span,strike,strong,style,sub,summary,sup,svg,table,tbody,td,template,textarea,tfoot,th,thead,time,title,tr,track,tt,u,ul,var,video,wbr,webview,xmp".split(","));
+const COMPOSED_BODY_FRAMING = /*#__PURE__*/new Set(["content-length", "content-encoding", "transfer-encoding"]);
+function isHttpNavigationTarget(target) {
+  try {
+    const protocol = new URL(target, "http://base.invalid").protocol;
+    return protocol === "http:" || protocol === "https:";
+  } catch {
+    return false;
+  }
+}
 
 const transparentOptions = {
   transparent: true,
@@ -286,6 +295,7 @@ function respond(value, init = {}) {
     responseInit,
     headers
   } = initWithRevalidate(init);
+  for (const header of COMPOSED_BODY_FRAMING) headers.delete(header);
   if (NULL_BODY_STATUSES.has(responseInit.status)) {
     return new ResponseEnvelope(new Response(null, {
       ...responseInit,
@@ -2501,6 +2511,7 @@ function ssr(t) {
   return result;
 }
 function ssrClassName(value) {
+  if (typeof value === "number") return "" + value;
   if (!value) return "";
   if (typeof value === "string") return escape(value, true);
   value = classListToObject(value);
@@ -2986,7 +2997,8 @@ function classListToObject(classList) {
 function flattenClassList(list, result) {
   for (let i = 0, len = list.length; i < len; i++) {
     const item = list[i];
-    if (Array.isArray(item)) flattenClassList(item, result);else if (typeof item === "object" && item != null) Object.assign(result, item);else if (item || item === 0) result[item] = true;
+    if (Array.isArray(item)) flattenClassList(item, result);else if (typeof item === "object" && item != null) Object.assign(result, item);
+    else if (typeof item !== "boolean" && (item || item === 0)) result[item] = true;
   }
 }
 function tryResolveString(node) {
@@ -3156,7 +3168,8 @@ function copyInitHeaders(init) {
   for (const cookie of init.getSetCookie()) headers.append("Set-Cookie", cookie);
   return headers;
 }
-const STUB_GAP_FILL_EXCLUDED = /*#__PURE__*/new Set([ERROR_HEADER, BODY_FORMAT_HEADER, SINGLE_FLIGHT_HEADER, REVALIDATE_HEADER, REDIRECT_HEADER, "Location"].map(header => header.toLowerCase()));
+const STUB_GAP_FILL_EXCLUDED = /*#__PURE__*/new Set([ERROR_HEADER, BODY_FORMAT_HEADER, SINGLE_FLIGHT_HEADER, REVALIDATE_HEADER, REDIRECT_HEADER, "Location",
+...COMPOSED_BODY_FRAMING].map(header => header.toLowerCase()));
 function fillsStubGap(key, headers, response) {
   if (key === "set-cookie" || STUB_GAP_FILL_EXCLUDED.has(key)) return false;
   if (response.body === null && (key === "content-type" || key === "content-length")) return false;
@@ -3185,6 +3198,7 @@ function commitEventResponse(response, event = getRequestEvent()) {
 }
 function deriveHead(stub, responseInit = {}) {
   const headers = mergeStubHeaders(copyInitHeaders(responseInit.headers), stub);
+  for (const header of COMPOSED_BODY_FRAMING) headers.delete(header);
   const status = stub && stub.status || responseInit.status || 200;
   const statusText = stub && stub.statusText || responseInit.statusText || undefined;
   return {
@@ -3268,7 +3282,7 @@ function createSSRResponse(result, event, options = {}) {
       end() {
         if (closed || !controller) return;
         const location = stub && stub.headers.get("Location");
-        if (location) {
+        if (location && isHttpNavigationTarget(location)) {
           const attr = nonceAttr(nonce, "script");
           enqueue(`<script${attr}>window.location=${JSON.stringify(location).replace(/</g, "\\u003c")}</script>`);
         }

package/dist/server.js

@@ -48,6 +48,15 @@ const Namespaces = {
 const VoidElements = /*#__PURE__*/new Set(["area", "base", "br", "col", "embed", "hr", "img", "input", "link", "meta", "param", "source", "track", "wbr"]);
 const RawTextElements = /*#__PURE__*/new Set(["style", "script", "noscript", "template", "textarea", "title"]);
 const DOMElements = /*#__PURE__*/new Set(/*#__PURE__*/"a,abbr,acronym,address,applet,area,article,aside,audio,b,base,basefont,bdi,bdo,bgsound,big,blink,blockquote,body,br,button,canvas,caption,center,cite,code,col,colgroup,content,data,datalist,dd,del,details,dfn,dialog,dir,div,dl,dt,em,embed,fieldset,figcaption,figure,font,footer,form,frame,frameset,h1,h2,h3,h4,h5,h6,head,header,hgroup,hr,html,i,iframe,image,img,input,ins,isindex,kbd,keygen,label,legend,li,link,listing,main,map,mark,marquee,math,menu,menuitem,meta,meter,multicol,nav,nextid,nobr,noembed,noframes,noindex,noscript,object,ol,optgroup,option,output,p,param,picture,plaintext,portal,pre,progress,q,rb,rp,rt,rtc,ruby,s,samp,script,search,section,select,shadow,slot,small,source,spacer,span,strike,strong,style,sub,summary,sup,svg,table,tbody,td,template,textarea,tfoot,th,thead,time,title,tr,track,tt,u,ul,var,video,wbr,webview,xmp".split(","));
+const COMPOSED_BODY_FRAMING = /*#__PURE__*/new Set(["content-length", "content-encoding", "transfer-encoding"]);
+function isHttpNavigationTarget(target) {
+  try {
+    const protocol = new URL(target, "http://base.invalid").protocol;
+    return protocol === "http:" || protocol === "https:";
+  } catch {
+    return false;
+  }
+}
 
 const transparentOptions = {
   transparent: true,
@@ -285,6 +294,7 @@ function respond(value, init = {}) {
     responseInit,
     headers
   } = initWithRevalidate(init);
+  for (const header of COMPOSED_BODY_FRAMING) headers.delete(header);
   if (NULL_BODY_STATUSES.has(responseInit.status)) {
     return new ResponseEnvelope(new Response(null, {
       ...responseInit,
@@ -2500,6 +2510,7 @@ function ssr(t) {
   return result;
 }
 function ssrClassName(value) {
+  if (typeof value === "number") return "" + value;
   if (!value) return "";
   if (typeof value === "string") return escape(value, true);
   value = classListToObject(value);
@@ -2985,7 +2996,8 @@ function classListToObject(classList) {
 function flattenClassList(list, result) {
   for (let i = 0, len = list.length; i < len; i++) {
     const item = list[i];
-    if (Array.isArray(item)) flattenClassList(item, result);else if (typeof item === "object" && item != null) Object.assign(result, item);else if (item || item === 0) result[item] = true;
+    if (Array.isArray(item)) flattenClassList(item, result);else if (typeof item === "object" && item != null) Object.assign(result, item);
+    else if (typeof item !== "boolean" && (item || item === 0)) result[item] = true;
   }
 }
 function tryResolveString(node) {
@@ -3155,7 +3167,8 @@ function copyInitHeaders(init) {
   for (const cookie of init.getSetCookie()) headers.append("Set-Cookie", cookie);
   return headers;
 }
-const STUB_GAP_FILL_EXCLUDED = /*#__PURE__*/new Set([ERROR_HEADER, BODY_FORMAT_HEADER, SINGLE_FLIGHT_HEADER, REVALIDATE_HEADER, REDIRECT_HEADER, "Location"].map(header => header.toLowerCase()));
+const STUB_GAP_FILL_EXCLUDED = /*#__PURE__*/new Set([ERROR_HEADER, BODY_FORMAT_HEADER, SINGLE_FLIGHT_HEADER, REVALIDATE_HEADER, REDIRECT_HEADER, "Location",
+...COMPOSED_BODY_FRAMING].map(header => header.toLowerCase()));
 function fillsStubGap(key, headers, response) {
   if (key === "set-cookie" || STUB_GAP_FILL_EXCLUDED.has(key)) return false;
   if (response.body === null && (key === "content-type" || key === "content-length")) return false;
@@ -3184,6 +3197,7 @@ function commitEventResponse(response, event = getRequestEvent()) {
 }
 function deriveHead(stub, responseInit = {}) {
   const headers = mergeStubHeaders(copyInitHeaders(responseInit.headers), stub);
+  for (const header of COMPOSED_BODY_FRAMING) headers.delete(header);
   const status = stub && stub.status || responseInit.status || 200;
   const statusText = stub && stub.statusText || responseInit.statusText || undefined;
   return {
@@ -3267,7 +3281,7 @@ function createSSRResponse(result, event, options = {}) {
       end() {
         if (closed || !controller) return;
         const location = stub && stub.headers.get("Location");
-        if (location) {
+        if (location && isHttpNavigationTarget(location)) {
           const attr = nonceAttr(nonce, "script");
           enqueue(`<script${attr}>window.location=${JSON.stringify(location).replace(/</g, "\\u003c")}</script>`);
         }

package/dist/web.cjs

@@ -49,6 +49,7 @@ const Namespaces = {
 const VoidElements = /*#__PURE__*/new Set(["area", "base", "br", "col", "embed", "hr", "img", "input", "link", "meta", "param", "source", "track", "wbr"]);
 const RawTextElements = /*#__PURE__*/new Set(["style", "script", "noscript", "template", "textarea", "title"]);
 const DOMElements = /*#__PURE__*/new Set(/*#__PURE__*/"a,abbr,acronym,address,applet,area,article,aside,audio,b,base,basefont,bdi,bdo,bgsound,big,blink,blockquote,body,br,button,canvas,caption,center,cite,code,col,colgroup,content,data,datalist,dd,del,details,dfn,dialog,dir,div,dl,dt,em,embed,fieldset,figcaption,figure,font,footer,form,frame,frameset,h1,h2,h3,h4,h5,h6,head,header,hgroup,hr,html,i,iframe,image,img,input,ins,isindex,kbd,keygen,label,legend,li,link,listing,main,map,mark,marquee,math,menu,menuitem,meta,meter,multicol,nav,nextid,nobr,noembed,noframes,noindex,noscript,object,ol,optgroup,option,output,p,param,picture,plaintext,portal,pre,progress,q,rb,rp,rt,rtc,ruby,s,samp,script,search,section,select,shadow,slot,small,source,spacer,span,strike,strong,style,sub,summary,sup,svg,table,tbody,td,template,textarea,tfoot,th,thead,time,title,tr,track,tt,u,ul,var,video,wbr,webview,xmp".split(","));
+const COMPOSED_BODY_FRAMING = /*#__PURE__*/new Set(["content-length", "content-encoding", "transfer-encoding"]);
 
 const transparentOptions = {
   transparent: true,
@@ -340,6 +341,8 @@ function installListDriver(driver) {
   exports.listDriver = driver;
 }
 const $$EVENT_OWNER = "_$SOLID_EVENT_OWNER";
+const $$EVENT_TUPLE = Symbol();
+const hasOwn = Object.prototype.hasOwnProperty;
 const INNER_OWNED = {};
 const delegatedEvents = new Set();
 const delegatedContainers = new Map();
@@ -457,7 +460,8 @@ function findOwner(target, state) {
 }
 function setProperty(node, name, value) {
   if (isHydrating(node)) return;
-  node[name] = value;
+  const nodeName = node.nodeName;
+  if (name === "value" && nodeName === "SELECT") queueMicrotask(() => node.value = value) || (node.value = value);else if ((name === "value" || name === "defaultValue") && (nodeName === "INPUT" || nodeName === "TEXTAREA")) node[name] = value ?? "";else node[name] = value;
 }
 let claimHandlers = null;
 const CLAIM_SEAM = Symbol.for("solid.element-claims");
@@ -491,7 +495,17 @@ function claimElement(node) {
 }
 function setAttribute(node, name, value) {
   if (isHydrating(node)) return;
-  if (value == null || value === false) node.removeAttribute(name);else node.setAttribute(name, value === true ? "" : value);
+  const selectMultiple = name === "multiple" && node.localName === "select";
+  if (value == null || value === false) node.removeAttribute(name);else {
+    node.setAttribute(name, value === true ? "" : value);
+    if (selectMultiple && !node._$multiple) {
+      const options = node.options;
+      for (let i = 0; i < options.length; i++) {
+        if (options[i].defaultSelected) options[i].selected = true;
+      }
+    }
+  }
+  if (selectMultiple) node._$multiple = true;
   if (claimHandlers !== null && (name === "href" || name === "action")) claimElement(node);
 }
 function setAttributeNS(node, namespace, name, value) {
@@ -499,22 +513,32 @@ function setAttributeNS(node, namespace, name, value) {
   if (value == null || value === false) node.removeAttributeNS(namespace, name.indexOf(":") > -1 ? name.split(":").pop() : name);else node.setAttributeNS(namespace, name, value === true ? "" : value);
 }
 function className(node, value, prev) {
-  if (isHydrating(node)) return;
+  if (typeof value === "number") value = "" + value;
+  if (typeof prev === "number") prev = "" + prev;
+  if (isHydrating(node)) {
+    node._$classes = value && typeof value === "object" ? classListToObject(value) : undefined;
+    return;
+  }
   if (value == null || value === false) {
-    prev && node.removeAttribute("class");
+    if (prev || node._$classes) {
+      node.removeAttribute("class");
+      node._$classes = undefined;
+    }
     return;
   }
   if (typeof value === "string") {
+    node._$classes = undefined;
     value !== prev && node.setAttribute("class", value);
     return;
   }
+  let applied;
   if (typeof prev === "string") {
-    prev = {};
+    applied = {};
     node.removeAttribute("class");
-  } else prev = classListToObject(prev || {});
+  } else applied = node._$classes || classListToObject(prev || {});
   value = classListToObject(value);
-  const classKeys = Object.keys(value || {});
-  const prevKeys = Object.keys(prev);
+  const classKeys = Object.keys(value);
+  const prevKeys = Object.keys(applied);
   let i, len;
   for (i = 0, len = prevKeys.length; i < len; i++) {
     const key = prevKeys[i];
@@ -524,22 +548,34 @@ function className(node, value, prev) {
   for (i = 0, len = classKeys.length; i < len; i++) {
     const key = classKeys[i],
       classValue = !!value[key];
-    if (!key || key === "undefined" || prev[key] === classValue || !classValue) continue;
+    if (!key || key === "undefined" || applied[key] === classValue || !classValue) continue;
     node.classList.add(key);
   }
+  node._$classes = value;
 }
 function addEvent(node, name, handler, delegate) {
   if (delegate) {
+    const key = `$$${name}`;
+    let data;
     if (Array.isArray(handler)) {
-      node[`$$${name}`] = handler[0];
-      node[`$$${name}Data`] = handler[1];
-    } else node[`$$${name}`] = handler;
-  } else if (Array.isArray(handler)) {
+      data = handler[1];
+      node[key] = handler[0];
+    } else node[key] = handler;
+    node[`${key}Data`] = data;
+    return;
+  }
+  if (Array.isArray(handler)) {
     const handlerFn = handler[0];
-    node.addEventListener(name, handler[0] = e => handlerFn.call(node, handler[1], e));
-  } else node.addEventListener(name, handler, typeof handler !== "function" && handler);
+    const listener = e => handlerFn.call(node, handler[1], e);
+    listener[$$EVENT_TUPLE] = handler;
+    node.addEventListener(name, listener);
+    return listener;
+  }
+  node.addEventListener(name, handler, typeof handler !== "function" && handler);
+  return handler;
 }
 function style(node, value, prev) {
+  if (isHydrating(node)) return;
   if (!value) {
     if (prev || node._$styles) {
       setAttribute(node, "style");
@@ -564,12 +600,13 @@ function style(node, value, prev) {
   }
   let v, s;
   for (s in applied) {
-    if (value[s] == null) {
+    if (!hasOwn.call(value, s) || value[s] == null) {
       nodeStyle.removeProperty(s);
       delete applied[s];
     }
   }
   for (s in value) {
+    if (!hasOwn.call(value, s)) continue;
     v = value[s];
     if (v != null && v !== applied[s]) {
       nodeStyle.setProperty(s, v);
@@ -578,20 +615,26 @@ function style(node, value, prev) {
   }
 }
 function setStyleProperty(node, name, value) {
+  if (isHydrating(node)) return;
   value != null ? node.style.setProperty(name, value) : node.style.removeProperty(name);
 }
 function spread(node, props = {}, skipChildren) {
   const prevProps = {};
   const get = typeof props === "function" ? props : () => props;
-  if (!skipChildren) insert(node, () => get().children);
+  if (!skipChildren) insert(node, () => {
+    const source = get();
+    return hasOwn.call(source, "children") ? source.children : undefined;
+  });
   effect(() => {
-    const r = get().ref;
+    const source = get();
+    const r = hasOwn.call(source, "ref") && source.ref;
     (typeof r === "function" || Array.isArray(r)) && ref(() => r, node);
   }, () => {});
   effect(() => {
     const source = get();
     const newProps = {};
     for (const prop in source) {
+      if (!hasOwn.call(source, prop)) continue;
       if (prop === "children" || prop === "ref") continue;
       newProps[prop] = source[prop];
     }
@@ -623,6 +666,19 @@ function scope(fn) {
 const SCOPE_OPTIONS = {
   scope: true
 };
+let insertionParent = null;
+function getInsertionParent() {
+  return insertionParent;
+}
+function withInsertionParent(parent, fn) {
+  const prev = insertionParent;
+  insertionParent = parent;
+  try {
+    return fn();
+  } finally {
+    insertionParent = prev;
+  }
+}
 let hydrationRt = null;
 function installHydrationRuntime() {
   hydrationRt = {
@@ -690,7 +746,7 @@ function insert(parent, accessor, marker, initial, options) {
     if (exports.listDriver(parent, accessor, marker, () => solidJs.runWithOwner(owner, () => insert(parent, () => listAccessor(), marker, marker !== undefined ? [] : undefined, options)))) return;
   }
   if (typeof accessor !== "function") {
-    accessor = normalize(accessor, initial, multi, true);
+    accessor = withInsertionParent(parent, () => normalize(accessor, initial, multi, true));
     if (typeof accessor !== "function") {
       insertExpression(parent, accessor, initial, marker);
       host && tagHost(accessor, host);
@@ -705,9 +761,9 @@ function insert(parent, accessor, marker, initial, options) {
   let current = initial;
   effect(prev => {
     if (hydrationRt !== null) current = hydrationRt.reclaimRegion(current, parent, marker);
-    const value = normalize(accessor(), current, multi, true);
+    const value = withInsertionParent(parent, () => normalize(accessor(), current, multi, true));
     if (typeof value !== "function") return value;
-    effect(() => (hydrationRt !== null && (current = hydrationRt.reclaimRegion(current, parent, marker)), normalize(value, current, multi)), inner => {
+    effect(() => (hydrationRt !== null && (current = hydrationRt.reclaimRegion(current, parent, marker)), withInsertionParent(parent, () => normalize(value, current, multi))), inner => {
       current = insertExpression(parent, inner, current, marker);
       host && tagHost(current, host);
     }, prev !== undefined && !(options && options.schedule) ? {
@@ -1367,7 +1423,8 @@ function classListToObject(classList) {
 function flattenClassList(list, result) {
   for (let i = 0, len = list.length; i < len; i++) {
     const item = list[i];
-    if (Array.isArray(item)) flattenClassList(item, result);else if (typeof item === "object" && item != null) Object.assign(result, item);else if (item || item === 0) result[item] = true;
+    if (Array.isArray(item)) flattenClassList(item, result);else if (typeof item === "object" && item != null) Object.assign(result, item);
+    else if (typeof item !== "boolean" && (item || item === 0)) result[item] = true;
   }
 }
 function assignProp(node, prop, value, prev, skipRef, nodeName) {
@@ -1383,12 +1440,13 @@ function assignProp(node, prop, value, prev, skipRef, nodeName) {
     const name = prop.slice(2).toLowerCase();
     const delegate = DelegatedEvents.has(name);
     if (!delegate && prev) {
-      const h = Array.isArray(prev) ? prev[0] : prev;
-      node.removeEventListener(name, h);
+      if (Array.isArray(value) && typeof prev === "function" && prev[$$EVENT_TUPLE] === value) return prev;
+      node.removeEventListener(name, prev, typeof prev !== "function" && prev);
     }
     if (delegate || value) {
-      addEvent(node, name, value, delegate);
+      const attached = addEvent(node, name, value, delegate);
       delegate && delegateEvents([name]);
+      if (!delegate) return attached;
     }
   } else if (hasNamespace && prop.slice(0, 5) === "prop:" || ChildProperties.has(prop) || DOMWithState[nodeName]?.[prop]) {
     if (hasNamespace) prop = prop.slice(5);else if (isHydrating(node)) return value;
@@ -1428,7 +1486,7 @@ function eventHandler(e, container, state) {
     }
     if (handler && !node.disabled) {
       const data = node[`${key}Data`];
-      data !== undefined ? handler.call(node, data, e) : handler.call(node, e);
+      data !== undefined ? handler.call(node, data, e) : typeof handler === "function" ? handler.call(node, e) : handler.handleEvent(e);
       if (e.cancelBubble) return;
     }
     node.host && typeof node.host !== "string" && !node.host._$host && node.contains(e.target) && retarget(node.host);
@@ -1548,7 +1606,7 @@ function normalize(value, current, multi, doNotUnwrap) {
       const item = value[i],
         prev = current && current[i],
         t = typeof item;
-      if ((t === "string" || t === "number") && prev && prev.nodeType === 3) value[i] = prev;
+      if ((t === "string" || t === "number") && prev && prev.nodeType === 3 && isHydrating(prev)) value[i] = prev;
     }
   }
   return value;
@@ -2092,6 +2150,7 @@ function respond(value, init = {}) {
     responseInit,
     headers
   } = initWithRevalidate(init);
+  for (const header of COMPOSED_BODY_FRAMING) headers.delete(header);
   if (NULL_BODY_STATUSES.has(responseInit.status)) {
     return new ResponseEnvelope(new Response(null, {
       ...responseInit,
@@ -2204,9 +2263,24 @@ function dynamic(source) {
             return solidJs.untrack(() => component(props));
           }
         case "string":
-          const el = solidJs.sharedConfig.hydrating ? getNextElement() : createElement(component, solidJs.untrack(() => props.is));
-          spread(el, props);
-          return el;
+          {
+            if (solidJs.sharedConfig.hydrating) {
+              const el = getNextElement();
+              spread(el, props);
+              return el;
+            }
+            const owner = solidJs.getOwner();
+            let el;
+            return () => {
+              if (!el) {
+                solidJs.runWithOwner(owner, () => {
+                  el = createElement(component, solidJs.untrack(() => props.is));
+                  spread(el, props);
+                });
+              }
+              return el;
+            };
+          }
       }
     });
   };
@@ -2215,8 +2289,15 @@ function Dynamic(props) {
   const Comp = dynamic(() => props.component);
   return solidJs.createComponent(Comp, solidJs.omit(props, "component"));
 }
+const AmbiguousSVGElements = /*#__PURE__*/new Set(["a", "script", "style", "title"]);
 function createElement(tagName, is = undefined) {
-  return SVGElements.has(tagName) ? document.createElementNS(Namespaces.svg, tagName) : MathMLElements.has(tagName) ? document.createElementNS(Namespaces.mathml, tagName) : document.createElement(tagName, {
+  if (SVGElements.has(tagName)) return document.createElementNS(Namespaces.svg, tagName);
+  if (MathMLElements.has(tagName)) return document.createElementNS(Namespaces.mathml, tagName);
+  if (AmbiguousSVGElements.has(tagName)) {
+    const parent = getInsertionParent();
+    if (parent && parent.namespaceURI === Namespaces.svg && parent.localName !== "foreignObject") return document.createElementNS(Namespaces.svg, tagName);
+  }
+  return document.createElement(tagName, {
     is
   });
 }
@@ -2348,6 +2429,7 @@ exports.getDelegatedRoot = getDelegatedRoot;
 exports.getExpectedRedirectStatus = getExpectedRedirectStatus;
 exports.getFirstChild = getFirstChild;
 exports.getHydrationKey = getHydrationKey;
+exports.getInsertionParent = getInsertionParent;
 exports.getNextElement = getNextElement;
 exports.getNextMarker = getNextMarker;
 exports.getNextMatch = getNextMatch;