Skip to content

Commit df5064b

Browse files
committed
always use fragment with template_with_script()
1 parent 3d8f987 commit df5064b

File tree

1 file changed

+27
-36
lines changed

1 file changed

+27
-36
lines changed

packages/svelte/src/internal/client/dom/template.js

Lines changed: 27 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -73,19 +73,23 @@ export function template(content, flags) {
7373
/*#__NO_SIDE_EFFECTS__*/
7474
export function template_with_script(content, flags) {
7575
var first = true;
76-
var fn = template(content, flags);
76+
var fn = template(content, flags | TEMPLATE_FRAGMENT);
7777

7878
return () => {
7979
if (hydrating) return fn();
8080

81-
var node = /** @type {Element | DocumentFragment} */ (fn());
81+
var fragment = /** @type {DocumentFragment} */ (fn());
8282

8383
if (first) {
8484
first = false;
85-
run_scripts(node);
85+
run_scripts(fragment);
8686
}
8787

88-
return node;
88+
if ((flags & TEMPLATE_FRAGMENT) !== 0) {
89+
return fragment;
90+
}
91+
92+
return /** @type {Node} */ (fragment.firstChild);
8993
};
9094
}
9195

@@ -152,19 +156,23 @@ export function ns_template(content, flags, ns = 'svg') {
152156
/*#__NO_SIDE_EFFECTS__*/
153157
export function svg_template_with_script(content, flags) {
154158
var first = true;
155-
var fn = ns_template(content, flags);
159+
var fn = ns_template(content, flags | TEMPLATE_FRAGMENT);
156160

157161
return () => {
158162
if (hydrating) return fn();
159163

160-
var node = /** @type {Element | DocumentFragment} */ (fn());
164+
var fragment = /** @type {DocumentFragment} */ (fn());
161165

162166
if (first) {
163167
first = false;
164-
run_scripts(node);
168+
run_scripts(fragment);
169+
}
170+
171+
if ((flags & TEMPLATE_FRAGMENT) !== 0) {
172+
return fragment;
165173
}
166174

167-
return node;
175+
return /** @type {Node} */ (fragment.firstChild);
168176
};
169177
}
170178

@@ -181,48 +189,31 @@ export function mathml_template(content, flags) {
181189
/**
182190
* Creating a document fragment from HTML that contains script tags will not execute
183191
* the scripts. We need to replace the script tags with new ones so that they are executed.
184-
* @param {Element | DocumentFragment} node
192+
* @param {DocumentFragment} fragment
185193
*/
186-
function run_scripts(node) {
194+
function run_scripts(fragment) {
187195
// scripts were SSR'd, in which case they will run
188196
if (hydrating) return;
189197

190-
const is_fragment = node.nodeType === 11;
191-
const scripts =
192-
/** @type {HTMLElement} */ (node).tagName === 'SCRIPT'
193-
? [/** @type {HTMLScriptElement} */ (node)]
194-
: node.querySelectorAll('script');
195198
const effect = /** @type {Effect} */ (active_effect);
196199

197-
for (const script of scripts) {
200+
for (const script of fragment.querySelectorAll('script')) {
198201
const clone = document.createElement('script');
199202
for (var attribute of script.attributes) {
200203
clone.setAttribute(attribute.name, attribute.value);
201204
}
202205

203206
clone.textContent = script.textContent;
204207

205-
const replace = () => {
206-
// The script has changed - if it's at the edges, the effect now points at dead nodes
207-
if (is_fragment ? node.firstChild === script : node === script) {
208-
effect.nodes_start = clone;
209-
}
210-
if (is_fragment ? node.lastChild === script : node === script) {
211-
effect.nodes_end = clone;
212-
}
213-
214-
script.replaceWith(clone);
215-
};
216-
217-
// If node === script tag, replaceWith will do nothing because there's no parent yet,
218-
// waiting until that's the case using an effect solves this.
219-
// Don't do it in other circumstances or we could accidentally execute scripts
220-
// in an adjacent @html tag that was instantiated in the meantime.
221-
if (script === node) {
222-
queue_micro_task(replace);
223-
} else {
224-
replace();
208+
// The script has changed - if it's at the edges, the effect now points at dead nodes
209+
if (fragment.firstChild === script) {
210+
effect.nodes_start = clone;
225211
}
212+
if (fragment.lastChild === script) {
213+
effect.nodes_end = clone;
214+
}
215+
216+
script.replaceWith(clone);
226217
}
227218
}
228219

0 commit comments

Comments
 (0)