From c3c455472cdfdc4b759de2d46d51918dec66a670 Mon Sep 17 00:00:00 2001
From: Nolan Lawson <nlawson@salesforce.com>
Date: Mon, 21 Oct 2024 16:14:56 -0700
Subject: [PATCH] fix(template-compiler): disable static content optimization
 for iframes

---
 .../test/rendering/iframe/index.spec.js        | 17 +++++++++++++++++
 .../iframe/x/component/component.html          |  3 +++
 .../rendering/iframe/x/component/component.js  |  3 +++
 .../attributes/attribute-allow/expected.js     | 13 +++++++++----
 .../no-escaping-tags/expected.js               | 18 +++++++++++-------
 .../src/codegen/static-element.ts              |  3 +++
 6 files changed, 46 insertions(+), 11 deletions(-)
 create mode 100644 packages/@lwc/integration-karma/test/rendering/iframe/index.spec.js
 create mode 100644 packages/@lwc/integration-karma/test/rendering/iframe/x/component/component.html
 create mode 100644 packages/@lwc/integration-karma/test/rendering/iframe/x/component/component.js

diff --git a/packages/@lwc/integration-karma/test/rendering/iframe/index.spec.js b/packages/@lwc/integration-karma/test/rendering/iframe/index.spec.js
new file mode 100644
index 0000000000..a72f3183f4
--- /dev/null
+++ b/packages/@lwc/integration-karma/test/rendering/iframe/index.spec.js
@@ -0,0 +1,17 @@
+import { createElement } from 'lwc';
+import Component from 'x/component';
+
+let spy;
+
+beforeEach(() => {
+    spy = spyOn(Element.prototype, 'setAttribute');
+});
+
+it('renders iframes correctly - W-17015807', async () => {
+    const elm = createElement('x-component', { is: Component });
+    document.body.appendChild(elm);
+
+    await Promise.resolve();
+
+    expect(spy).toHaveBeenCalledOnceWith('src', 'about:blank');
+});
diff --git a/packages/@lwc/integration-karma/test/rendering/iframe/x/component/component.html b/packages/@lwc/integration-karma/test/rendering/iframe/x/component/component.html
new file mode 100644
index 0000000000..283bcc3e78
--- /dev/null
+++ b/packages/@lwc/integration-karma/test/rendering/iframe/x/component/component.html
@@ -0,0 +1,3 @@
+<template>
+    <iframe src="about:blank"></iframe>
+</template>
diff --git a/packages/@lwc/integration-karma/test/rendering/iframe/x/component/component.js b/packages/@lwc/integration-karma/test/rendering/iframe/x/component/component.js
new file mode 100644
index 0000000000..ca8dce94e0
--- /dev/null
+++ b/packages/@lwc/integration-karma/test/rendering/iframe/x/component/component.js
@@ -0,0 +1,3 @@
+import { LightningElement } from 'lwc';
+
+export default class extends LightningElement {}
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/attribute-allow/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/attribute-allow/expected.js
index cc4e00862c..b6b61aaa20 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/attribute-allow/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/attributes/attribute-allow/expected.js
@@ -1,10 +1,15 @@
 import _implicitStylesheets from "./attribute-allow.css";
 import _implicitScopedStylesheets from "./attribute-allow.scoped.css?scoped=true";
-import { freezeTemplate, parseFragment, registerTemplate } from "lwc";
-const $fragment1 = parseFragment`<iframe allow="geolocation https://google-developers.appspot.com"${3}></iframe>`;
+import { freezeTemplate, registerTemplate } from "lwc";
+const stc0 = {
+  attrs: {
+    allow: "geolocation https://google-developers.appspot.com",
+  },
+  key: 0,
+};
 function tmpl($api, $cmp, $slotset, $ctx) {
-  const { st: api_static_fragment } = $api;
-  return [api_static_fragment($fragment1, 1)];
+  const { h: api_element } = $api;
+  return [api_element("iframe", stc0)];
   /*LWC compiler vX.X.X*/
 }
 export default registerTemplate(tmpl);
diff --git a/packages/@lwc/template-compiler/src/__tests__/fixtures/static-content/no-escaping-tags/expected.js b/packages/@lwc/template-compiler/src/__tests__/fixtures/static-content/no-escaping-tags/expected.js
index 6b146ef0ac..3aae88b235 100644
--- a/packages/@lwc/template-compiler/src/__tests__/fixtures/static-content/no-escaping-tags/expected.js
+++ b/packages/@lwc/template-compiler/src/__tests__/fixtures/static-content/no-escaping-tags/expected.js
@@ -2,16 +2,20 @@ import _implicitStylesheets from "./no-escaping-tags.css";
 import _implicitScopedStylesheets from "./no-escaping-tags.scoped.css?scoped=true";
 import { freezeTemplate, parseFragment, registerTemplate } from "lwc";
 const $fragment1 = parseFragment`<xmp${3}>&lt;/xmp&gt;Hello &lt;div&gt;world&lt;/div&gt; <div>foo</div></xmp>`;
-const $fragment2 = parseFragment`<iframe${3}>Hello &lt;div&gt;world&lt;/div&gt; <div>foo</div></iframe>`;
-const $fragment3 = parseFragment`<noembed${3}>Hello &lt;div&gt;world&lt;/div&gt; <div>foo</div></noembed>`;
-const $fragment4 = parseFragment`<noframes${3}><p>It seems your browser does not support frames or is configured to not allow them.</p></noframes>`;
+const $fragment2 = parseFragment`<noembed${3}>Hello &lt;div&gt;world&lt;/div&gt; <div>foo</div></noembed>`;
+const $fragment3 = parseFragment`<noframes${3}><p>It seems your browser does not support frames or is configured to not allow them.</p></noframes>`;
+const stc0 = {
+  key: 2,
+};
 function tmpl($api, $cmp, $slotset, $ctx) {
-  const { st: api_static_fragment } = $api;
+  const { st: api_static_fragment, t: api_text, h: api_element } = $api;
   return [
     api_static_fragment($fragment1, 1),
-    api_static_fragment($fragment2, 3),
-    api_static_fragment($fragment3, 5),
-    api_static_fragment($fragment4, 7),
+    api_element("iframe", stc0, [
+      api_text("Hello <div>world</div> <div>foo</div>"),
+    ]),
+    api_static_fragment($fragment2, 4),
+    api_static_fragment($fragment3, 6),
   ];
   /*LWC compiler vX.X.X*/
 }
diff --git a/packages/@lwc/template-compiler/src/codegen/static-element.ts b/packages/@lwc/template-compiler/src/codegen/static-element.ts
index 76fd0be4c4..64d6813361 100644
--- a/packages/@lwc/template-compiler/src/codegen/static-element.ts
+++ b/packages/@lwc/template-compiler/src/codegen/static-element.ts
@@ -61,6 +61,9 @@ function isStaticNode(node: BaseElement, apiVersion: APIVersion): boolean {
     // it is an element
     result &&= isElement(node);
 
+    // See W-17015807
+    result &&= node.name !== 'iframe';
+
     // all attrs are static-safe
     // the criteria to determine safety can be found in computeAttrValue
     result &&= attributes.every(({ name }) => {