Skip to content

Commit 7ebd673

Browse files
DylanPierceyDylanPiercey
committedMar 15, 2025
fix: extra placeholder bindings for html- core tags
1 parent 4a2e2e3 commit 7ebd673

File tree

14 files changed

+148
-30
lines changed

14 files changed

+148
-30
lines changed
 

‎.changeset/pink-worms-cry.md

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
"@marko/runtime-tags": patch
3+
---
4+
5+
Fix issue with html-script, html-style and html-comment causing extra placeholder bindings to be registered.

‎packages/runtime-tags/src/__tests__/fixtures/html-script/__snapshots__/csr-sanitized.expected.md

+20
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,39 @@
11
# Render
2+
```html
3+
<div>
4+
0
5+
</div>
6+
```
27

38

49
# Render
510
```js
611
container.querySelector("script").click();
712
```
13+
```html
14+
<div>
15+
1
16+
</div>
17+
```
818

919

1020
# Render
1121
```js
1222
container.querySelector("script").click();
1323
```
24+
```html
25+
<div>
26+
2
27+
</div>
28+
```
1429

1530

1631
# Render
1732
```js
1833
container.querySelector("script").click();
1934
```
35+
```html
36+
<div>
37+
3
38+
</div>
39+
```

‎packages/runtime-tags/src/__tests__/fixtures/html-script/__snapshots__/csr.expected.md

+16-1
Original file line numberDiff line numberDiff line change
@@ -11,11 +11,14 @@
1111
}
1212
1313
</script>
14+
<div>
15+
0
16+
</div>
1417
```
1518

1619
# Mutations
1720
```
18-
INSERT script
21+
INSERT script, div
1922
```
2023

2124
# Render
@@ -34,12 +37,16 @@ container.querySelector("script").click();
3437
}
3538
3639
</script>
40+
<div>
41+
1
42+
</div>
3743
```
3844

3945
# Mutations
4046
```
4147
REMOVE #text in script
4248
INSERT script/#text
49+
UPDATE div/#text "0" => "1"
4350
```
4451

4552
# Render
@@ -58,12 +65,16 @@ container.querySelector("script").click();
5865
}
5966
6067
</script>
68+
<div>
69+
2
70+
</div>
6171
```
6272

6373
# Mutations
6474
```
6575
REMOVE #text in script
6676
INSERT script/#text
77+
UPDATE div/#text "1" => "2"
6778
```
6879

6980
# Render
@@ -82,10 +93,14 @@ container.querySelector("script").click();
8293
}
8394
8495
</script>
96+
<div>
97+
3
98+
</div>
8599
```
86100

87101
# Mutations
88102
```
89103
REMOVE #text in script
90104
INSERT script/#text
105+
UPDATE div/#text "2" => "3"
91106
```

‎packages/runtime-tags/src/__tests__/fixtures/html-script/__snapshots__/dom.expected/template.hydrate.js

+2-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
// size: 209 (min) 150 (brotli)
1+
// size: 224 (min) 167 (brotli)
22
const _count_effect = _$.effect("a1", (_scope, { 2: count }) =>
33
_$.on(_scope[0], "click", function () {
44
_count(_scope, count + 1);
@@ -9,6 +9,7 @@ const _count_effect = _$.effect("a1", (_scope, { 2: count }) =>
99
_scope[0],
1010
`\n {\n "imports": {\n "${count}": "https://markojs.com",\n }\n }\n`,
1111
),
12+
_$.data(_scope[1], count),
1213
_count_effect(_scope);
1314
});
1415
init();

‎packages/runtime-tags/src/__tests__/fixtures/html-script/__snapshots__/dom.expected/template.js

+3-2
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
export const _template_ = "<script type=importmap></script>";
2-
export const _walks_ = /* get, over(1) */" b";
1+
export const _template_ = "<script type=importmap></script><div> </div>";
2+
export const _walks_ = /* get, over(1), next(1), get, out(1) */" bD l";
33
import * as _$ from "@marko/runtime-tags/debug/dom";
44
const _count_effect = _$.effect("__tests__/template.marko_0_count", (_scope, {
55
count
@@ -14,6 +14,7 @@ const _count = /* @__PURE__ */_$.state("count/2", (_scope, count) => {
1414
}
1515
}
1616
`);
17+
_$.data(_scope["#text/1"], count);
1718
_count_effect(_scope);
1819
});
1920
export function _setup_(_scope) {

‎packages/runtime-tags/src/__tests__/fixtures/html-script/__snapshots__/html.expected/template.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ export default /* @__PURE__ */_$.createTemplate("__tests__/template.marko", inpu
88
"${_$.escapeScript(count)}": "https://markojs.com",
99
}
1010
}
11-
</script>${_$.markResumeNode(_scope0_id, "#script/0")}`);
11+
</script>${_$.markResumeNode(_scope0_id, "#script/0")}<div>${_$.escapeXML(count)}${_$.markResumeNode(_scope0_id, "#text/1")}</div>`);
1212
_$.writeEffect(_scope0_id, "__tests__/template.marko_0_count");
1313
_$.writeScope(_scope0_id, {
1414
count

‎packages/runtime-tags/src/__tests__/fixtures/html-script/__snapshots__/resume-sanitized.expected.md

+20
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,39 @@
11
# Render
2+
```html
3+
<div>
4+
0
5+
</div>
6+
```
27

38

49
# Render
510
```js
611
container.querySelector("script").click();
712
```
13+
```html
14+
<div>
15+
1
16+
</div>
17+
```
818

919

1020
# Render
1121
```js
1222
container.querySelector("script").click();
1323
```
24+
```html
25+
<div>
26+
2
27+
</div>
28+
```
1429

1530

1631
# Render
1732
```js
1833
container.querySelector("script").click();
1934
```
35+
```html
36+
<div>
37+
3
38+
</div>
39+
```

‎packages/runtime-tags/src/__tests__/fixtures/html-script/__snapshots__/resume.expected.md

+37-14
Original file line numberDiff line numberDiff line change
@@ -14,11 +14,16 @@
1414
1515
</script>
1616
<!--M_*1 #script/0-->
17+
</head>
18+
<body>
19+
<div>
20+
0
21+
<!--M_*1 #text/1-->
22+
</div>
1723
<script>
1824
WALKER_RUNTIME("M")("_");M._.r=[_=&gt;(_.a={1:{count:0}}),1,"__tests__/template.marko_0_count",0];M._.w()
1925
</script>
20-
</head>
21-
<body />
26+
</body>
2227
</html>
2328
```
2429

@@ -42,18 +47,24 @@ container.querySelector("script").click();
4247
4348
</script>
4449
<!--M_*1 #script/0-->
50+
</head>
51+
<body>
52+
<div>
53+
1
54+
<!--M_*1 #text/1-->
55+
</div>
4556
<script>
4657
WALKER_RUNTIME("M")("_");M._.r=[_=&gt;(_.a={1:{count:0}}),1,"__tests__/template.marko_0_count",0];M._.w()
4758
</script>
48-
</head>
49-
<body />
59+
</body>
5060
</html>
5161
```
5262

5363
# Mutations
5464
```
55-
REMOVE #text in html/head/script0
56-
INSERT html/head/script0/#text
65+
REMOVE #text in html/head/script
66+
INSERT html/head/script/#text
67+
UPDATE html/body/div/#text "0" => "1"
5768
```
5869

5970
# Render
@@ -75,18 +86,24 @@ container.querySelector("script").click();
7586
7687
</script>
7788
<!--M_*1 #script/0-->
89+
</head>
90+
<body>
91+
<div>
92+
2
93+
<!--M_*1 #text/1-->
94+
</div>
7895
<script>
7996
WALKER_RUNTIME("M")("_");M._.r=[_=&gt;(_.a={1:{count:0}}),1,"__tests__/template.marko_0_count",0];M._.w()
8097
</script>
81-
</head>
82-
<body />
98+
</body>
8399
</html>
84100
```
85101

86102
# Mutations
87103
```
88-
REMOVE #text in html/head/script0
89-
INSERT html/head/script0/#text
104+
REMOVE #text in html/head/script
105+
INSERT html/head/script/#text
106+
UPDATE html/body/div/#text "1" => "2"
90107
```
91108

92109
# Render
@@ -108,16 +125,22 @@ container.querySelector("script").click();
108125
109126
</script>
110127
<!--M_*1 #script/0-->
128+
</head>
129+
<body>
130+
<div>
131+
3
132+
<!--M_*1 #text/1-->
133+
</div>
111134
<script>
112135
WALKER_RUNTIME("M")("_");M._.r=[_=&gt;(_.a={1:{count:0}}),1,"__tests__/template.marko_0_count",0];M._.w()
113136
</script>
114-
</head>
115-
<body />
137+
</body>
116138
</html>
117139
```
118140

119141
# Mutations
120142
```
121-
REMOVE #text in html/head/script0
122-
INSERT html/head/script0/#text
143+
REMOVE #text in html/head/script
144+
INSERT html/head/script/#text
145+
UPDATE html/body/div/#text "2" => "3"
123146
```

‎packages/runtime-tags/src/__tests__/fixtures/html-script/__snapshots__/ssr-sanitized.expected.md

+5
Original file line numberDiff line numberDiff line change
@@ -1 +1,6 @@
11
# Render End
2+
```html
3+
<div>
4+
0
5+
</div>
6+
```

‎packages/runtime-tags/src/__tests__/fixtures/html-script/__snapshots__/ssr.expected.md

+15-7
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
"0": "https://markojs.com",
77
}
88
}
9-
</script><!--M_*1 #script/0--><script>WALKER_RUNTIME("M")("_");M._.r=[_=>(_.a={1:{count:0}}),1,"__tests__/template.marko_0_count",0];M._.w()</script>
9+
</script><!--M_*1 #script/0--><div>0<!--M_*1 #text/1--></div><script>WALKER_RUNTIME("M")("_");M._.r=[_=>(_.a={1:{count:0}}),1,"__tests__/template.marko_0_count",0];M._.w()</script>
1010
```
1111

1212
# Render End
@@ -25,22 +25,30 @@
2525
2626
</script>
2727
<!--M_*1 #script/0-->
28+
</head>
29+
<body>
30+
<div>
31+
0
32+
<!--M_*1 #text/1-->
33+
</div>
2834
<script>
2935
WALKER_RUNTIME("M")("_");M._.r=[_=&gt;(_.a={1:{count:0}}),1,"__tests__/template.marko_0_count",0];M._.w()
3036
</script>
31-
</head>
32-
<body />
37+
</body>
3338
</html>
3439
```
3540

3641
# Mutations
3742
```
3843
INSERT html
3944
INSERT html/head
40-
INSERT html/head/script0
41-
INSERT html/head/script0/#text
45+
INSERT html/head/script
46+
INSERT html/head/script/#text
4247
INSERT html/head/#comment
43-
INSERT html/head/script1
44-
INSERT html/head/script1/#text
4548
INSERT html/body
49+
INSERT html/body/div
50+
INSERT html/body/div/#text
51+
INSERT html/body/div/#comment
52+
INSERT html/body/script
53+
INSERT html/body/script/#text
4654
```

‎packages/runtime-tags/src/__tests__/fixtures/html-script/template.marko

+1
Original file line numberDiff line numberDiff line change
@@ -6,3 +6,4 @@
66
}
77
}
88
</html-script>
9+
<div>${count}</div>

‎packages/runtime-tags/src/__tests__/fixtures/html-style/__snapshots__/dom.expected/template.hydrate.js

+3-3
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
1-
// size: 171 (min) 136 (brotli)
2-
const _count_effect = _$.effect("a1", (_scope, { 2: count }) =>
1+
// size: 171 (min) 132 (brotli)
2+
const _count_effect = _$.effect("a1", (_scope, { 1: count }) =>
33
_$.on(_scope[0], "click", function () {
44
_count(_scope, count + 1);
55
}),
66
),
7-
_count = _$.state(2, (_scope, count) => {
7+
_count = _$.state(1, (_scope, count) => {
88
_$.textContent(_scope[0], `\n .test {\n content: ${count}\n }\n`),
99
_count_effect(_scope);
1010
});

‎packages/runtime-tags/src/__tests__/fixtures/html-style/__snapshots__/dom.expected/template.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ const _count_effect = _$.effect("__tests__/template.marko_0_count", (_scope, {
66
}) => _$.on(_scope["#style/0"], "click", function () {
77
_count(_scope, count + 1), count;
88
}));
9-
const _count = /* @__PURE__ */_$.state("count/2", (_scope, count) => {
9+
const _count = /* @__PURE__ */_$.state("count/1", (_scope, count) => {
1010
_$.textContent(_scope["#style/0"], `
1111
.test {
1212
content: ${count}

0 commit comments

Comments
 (0)
Failed to load comments.