From 9c106f440146199eaaab9e28cc4e3ffe006e6e91 Mon Sep 17 00:00:00 2001 From: Kristiyan Kostadinov Date: Fri, 28 Mar 2025 14:56:37 +0100 Subject: [PATCH] refactor(core): introduce domProperty instruction (#60608) Renames the `hostProperty` instruction to `domProperty` since it's not really host-specific and we can use it for other DOM-specific operations in the future. PR Close #60608 --- .../chain_attribute_bindings_mixed.js | 2 +- .../chain_multiple_property_bindings.js | 2 +- .../host_bindings/chain_property_bindings_all.js | 2 +- .../chain_property_bindings_mixed.js | 2 +- .../host_bindings/host_bindings.js | 2 +- .../host_bindings_with_pure_functions.js | 2 +- .../host_bindings_with_temporaries.js | 2 +- .../host_bindings/sanitization.js | 8 ++++---- .../r3_view_compiler_bindings/order_bindings.js | 2 +- .../component_host_binding_slots.js | 2 +- .../directive_host_binding_slots.js | 2 +- .../binding_slots/host_binding_slots.js | 2 +- packages/compiler-cli/test/ngtsc/ngtsc_spec.ts | 8 ++++---- packages/compiler/src/render3/r3_identifiers.ts | 2 +- .../src/template/pipeline/ir/src/enums.ts | 4 ++-- .../src/template/pipeline/ir/src/expression.ts | 2 +- .../src/template/pipeline/ir/src/ops/host.ts | 12 ++++++------ .../src/template/pipeline/ir/src/ops/update.ts | 4 ++-- .../compiler/src/template/pipeline/src/ingest.ts | 4 ++-- .../src/template/pipeline/src/instruction.ts | 4 ++-- .../src/phases/binding_specialization.ts | 2 +- .../src/template/pipeline/src/phases/chaining.ts | 2 +- .../src/template/pipeline/src/phases/naming.ts | 2 +- .../src/template/pipeline/src/phases/ordering.ts | 8 ++++---- .../src/template/pipeline/src/phases/reify.ts | 4 ++-- .../pipeline/src/phases/resolve_sanitizers.ts | 4 ++-- .../template/pipeline/src/phases/var_counting.ts | 2 +- packages/core/src/core_render3_private_export.ts | 2 +- packages/core/src/render3/index.ts | 2 +- packages/core/src/render3/instructions/all.ts | 2 +- .../{host_property.ts => dom_property.ts} | 16 +++++++--------- packages/core/src/render3/jit/environment.ts | 2 +- .../test/render3/jit/declare_component_spec.ts | 2 +- .../test/render3/jit/declare_directive_spec.ts | 2 +- 34 files changed, 60 insertions(+), 62 deletions(-) rename packages/core/src/render3/instructions/{host_property.ts => dom_property.ts} (86%) diff --git a/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/host_bindings/chain_attribute_bindings_mixed.js b/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/host_bindings/chain_attribute_bindings_mixed.js index e8e6b44e78c..bf431f24e9d 100644 --- a/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/host_bindings/chain_attribute_bindings_mixed.js +++ b/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/host_bindings/chain_attribute_bindings_mixed.js @@ -1,7 +1,7 @@ hostBindings: function MyDirective_HostBindings(rf, ctx) { … if (rf & 2) { - $r3$.ɵɵhostProperty("tabindex", 1); + $r3$.ɵɵdomProperty("tabindex", 1); $r3$.ɵɵattribute("title", "my title")("id", "my-id"); } } diff --git a/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/host_bindings/chain_multiple_property_bindings.js b/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/host_bindings/chain_multiple_property_bindings.js index 81851110268..725902d22c7 100644 --- a/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/host_bindings/chain_multiple_property_bindings.js +++ b/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/host_bindings/chain_multiple_property_bindings.js @@ -1,6 +1,6 @@ hostBindings: function MyDirective_HostBindings(rf, ctx) { … if (rf & 2) { - $r3$.ɵɵhostProperty("title", ctx.myTitle)("tabindex", 1)("id", ctx.myId); + $r3$.ɵɵdomProperty("title", ctx.myTitle)("tabindex", 1)("id", ctx.myId); } } diff --git a/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/host_bindings/chain_property_bindings_all.js b/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/host_bindings/chain_property_bindings_all.js index 3c61c71182d..12c9eb1db48 100644 --- a/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/host_bindings/chain_property_bindings_all.js +++ b/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/host_bindings/chain_property_bindings_all.js @@ -1,6 +1,6 @@ hostBindings: function MyDirective_HostBindings(rf, ctx) { … if (rf & 2) { - $r3$.ɵɵhostProperty("tabindex", 1)("title", ctx.myTitle)("id", ctx.myId); + $r3$.ɵɵdomProperty("tabindex", 1)("title", ctx.myTitle)("id", ctx.myId); } } diff --git a/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/host_bindings/chain_property_bindings_mixed.js b/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/host_bindings/chain_property_bindings_mixed.js index 99df9091153..39c038dae0b 100644 --- a/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/host_bindings/chain_property_bindings_mixed.js +++ b/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/host_bindings/chain_property_bindings_mixed.js @@ -1,7 +1,7 @@ hostBindings: function MyDirective_HostBindings(rf, ctx) { … if (rf & 2) { - $r3$.ɵɵhostProperty("title", "my title")("id", "my-id"); + $r3$.ɵɵdomProperty("title", "my title")("id", "my-id"); $r3$.ɵɵattribute("tabindex", 1); } } diff --git a/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/host_bindings/host_bindings.js b/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/host_bindings/host_bindings.js index fbfcf022ce9..b3a833cc015 100644 --- a/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/host_bindings/host_bindings.js +++ b/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/host_bindings/host_bindings.js @@ -5,7 +5,7 @@ HostBindingDir.ɵdir = /*@__PURE__*/ $r3$.ɵɵdefineDirective({ hostVars: 1, hostBindings: function HostBindingDir_HostBindings(rf, ctx) { if (rf & 2) { - $r3$.ɵɵhostProperty("id", ctx.dirId); + $r3$.ɵɵdomProperty("id", ctx.dirId); } }, standalone: false diff --git a/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/host_bindings/host_bindings_with_pure_functions.js b/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/host_bindings/host_bindings_with_pure_functions.js index b29a320b1d9..6c1b5d27268 100644 --- a/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/host_bindings/host_bindings_with_pure_functions.js +++ b/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/host_bindings/host_bindings_with_pure_functions.js @@ -7,7 +7,7 @@ HostBindingComp.ɵcmp = /*@__PURE__*/ $r3$.ɵɵdefineComponent({ hostVars: 3, hostBindings: function HostBindingComp_HostBindings(rf, ctx) { if (rf & 2) { - $r3$.ɵɵhostProperty("id", $r3$.ɵɵpureFunction1(1, $ff$, ctx.id)); + $r3$.ɵɵdomProperty("id", $r3$.ɵɵpureFunction1(1, $ff$, ctx.id)); } }, standalone: false, diff --git a/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/host_bindings/host_bindings_with_temporaries.js b/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/host_bindings/host_bindings_with_temporaries.js index d81bd24fd7e..a93e2673a03 100644 --- a/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/host_bindings/host_bindings_with_temporaries.js +++ b/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/host_bindings/host_bindings_with_temporaries.js @@ -6,7 +6,7 @@ HostBindingDir.ɵdir = /*@__PURE__*/ $r3$.ɵɵdefineDirective({ hostBindings: function HostBindingDir_HostBindings(rf, ctx) { if (rf & 2) { let $tmp0$; - $r3$.ɵɵhostProperty("id", ($tmp0$ = ctx.getData()) == null ? null : $tmp0$.id); + $r3$.ɵɵdomProperty("id", ($tmp0$ = ctx.getData()) == null ? null : $tmp0$.id); } }, standalone: false diff --git a/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/host_bindings/sanitization.js b/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/host_bindings/sanitization.js index a533db448a4..11a0bec968b 100644 --- a/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/host_bindings/sanitization.js +++ b/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/host_bindings/sanitization.js @@ -1,13 +1,13 @@ hostBindings: function HostBindingDir_HostBindings(rf, ctx) { if (rf & 2) { - i0.ɵɵhostProperty("innerHtml", ctx.evil, i0.ɵɵsanitizeHtml)("href", ctx.evil, i0.ɵɵsanitizeUrlOrResourceUrl)("src", ctx.evil, i0.ɵɵsanitizeUrlOrResourceUrl)("sandbox", ctx.evil, i0.ɵɵvalidateIframeAttribute); - i0.ɵɵattribute("style", ctx.evil, i0.ɵɵsanitizeStyle); + $r3$.ɵɵdomProperty("innerHtml", ctx.evil, $r3$.ɵɵsanitizeHtml)("href", ctx.evil, $r3$.ɵɵsanitizeUrlOrResourceUrl)("src", ctx.evil, $r3$.ɵɵsanitizeUrlOrResourceUrl)("sandbox", ctx.evil, $r3$.ɵɵvalidateIframeAttribute); + $r3$.ɵɵattribute("style", ctx.evil, $r3$.ɵɵsanitizeStyle); } } … hostBindings: function HostBindingDir2_HostBindings(rf, ctx) { if (rf & 2) { - i0.ɵɵhostProperty("innerHtml", ctx.evil, i0.ɵɵsanitizeHtml)("href", ctx.evil, i0.ɵɵsanitizeUrl)("src", ctx.evil)("sandbox", ctx.evil, i0.ɵɵvalidateIframeAttribute); - i0.ɵɵattribute("style", ctx.evil, i0.ɵɵsanitizeStyle); + $r3$.ɵɵdomProperty("innerHtml", ctx.evil, $r3$.ɵɵsanitizeHtml)("href", ctx.evil, $r3$.ɵɵsanitizeUrl)("src", ctx.evil)("sandbox", ctx.evil, $r3$.ɵɵvalidateIframeAttribute); + $r3$.ɵɵattribute("style", ctx.evil, $r3$.ɵɵsanitizeStyle); } } diff --git a/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/order_bindings.js b/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/order_bindings.js index 8a977bdcb5d..5e7808da362 100644 --- a/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/order_bindings.js +++ b/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/order_bindings.js @@ -5,7 +5,7 @@ function MyCmp_HostBindings(rf, ctx) { i0.ɵɵlistener("event1", function MyCmp_event1_HostBindingHandler() { return ctx.foo(); }); } if (rf & 2) { - i0.ɵɵhostProperty("prop1", ctx.foo); + i0.ɵɵdomProperty("prop1", ctx.foo); i0.ɵɵattribute("attr1", ctx.foo); i0.ɵɵstyleMap(ctx.foo); i0.ɵɵclassMap(ctx.foo); diff --git a/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_styling/binding_slots/component_host_binding_slots.js b/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_styling/binding_slots/component_host_binding_slots.js index 8f5693e65c7..e3c4a671e75 100644 --- a/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_styling/binding_slots/component_host_binding_slots.js +++ b/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_styling/binding_slots/component_host_binding_slots.js @@ -2,7 +2,7 @@ hostAttrs: ["title", "foo title", __AttributeMarker.Classes__, "foo", "baz", __A hostVars: 6, hostBindings: function MyComponent_HostBindings(rf, ctx) { if (rf & 2) { - $r3$.ɵɵhostProperty("id", ctx.id)("title", ctx.title); + $r3$.ɵɵdomProperty("id", ctx.id)("title", ctx.title); $r3$.ɵɵstyleMap(ctx.myStyle); $r3$.ɵɵclassMap(ctx.myClass); } diff --git a/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_styling/binding_slots/directive_host_binding_slots.js b/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_styling/binding_slots/directive_host_binding_slots.js index 55f686cc84c..f82aa0fc14e 100644 --- a/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_styling/binding_slots/directive_host_binding_slots.js +++ b/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_styling/binding_slots/directive_host_binding_slots.js @@ -1,7 +1,7 @@ hostVars: 6, hostBindings: function WidthDirective_HostBindings(rf, ctx) { if (rf & 2) { - $r3$.ɵɵhostProperty("id", ctx.id)("title", ctx.title); + $r3$.ɵɵdomProperty("id", ctx.id)("title", ctx.title); $r3$.ɵɵstyleProp("width", ctx.myWidth); $r3$.ɵɵclassProp("foo", ctx.myFooClass); } diff --git a/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_styling/binding_slots/host_binding_slots.js b/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_styling/binding_slots/host_binding_slots.js index b6dc1fafa07..478a7d93657 100644 --- a/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_styling/binding_slots/host_binding_slots.js +++ b/packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_styling/binding_slots/host_binding_slots.js @@ -1,7 +1,7 @@ hostVars: 10, hostBindings: function MyDir_HostBindings(rf, ctx) { if (rf & 2) { - $r3$.ɵɵhostProperty("title", ctx.title); + $r3$.ɵɵdomProperty("title", ctx.title); $r3$.ɵɵsyntheticHostProperty("@anim", $r3$.ɵɵpureFunction2(7, _c1, ctx._animValue, $r3$.ɵɵpureFunction2(4, _c0, ctx._animParam1, ctx._animParam2))); diff --git a/packages/compiler-cli/test/ngtsc/ngtsc_spec.ts b/packages/compiler-cli/test/ngtsc/ngtsc_spec.ts index 1caaf5c995d..60740cc1f7d 100644 --- a/packages/compiler-cli/test/ngtsc/ngtsc_spec.ts +++ b/packages/compiler-cli/test/ngtsc/ngtsc_spec.ts @@ -5238,7 +5238,7 @@ runInEachFileSystem((os: string) => { i0.ɵɵlistener("click", function FooCmp_click_HostBindingHandler($event) { return ctx.onClick($event); })("click", function FooCmp_click_HostBindingHandler($event) { return ctx.onBodyClick($event); }, i0.ɵɵresolveBody)("change", function FooCmp_change_HostBindingHandler() { return ctx.onChange(ctx.arg1, ctx.arg2, ctx.arg3); }); } if (rf & 2) { - i0.ɵɵhostProperty("prop", ctx.bar); + i0.ɵɵdomProperty("prop", ctx.bar); i0.ɵɵattribute("hello", ctx.foo); i0.ɵɵclassProp("someclass", ctx.someClass); } @@ -8271,7 +8271,7 @@ runInEachFileSystem((os: string) => { hostVars: 6, hostBindings: function UnsafePropsDirective_HostBindings(rf, ctx) { if (rf & 2) { - i0.ɵɵhostProperty("href", ctx.propHref, i0.ɵɵsanitizeUrlOrResourceUrl)("src", ctx.propSrc, i0.ɵɵsanitizeUrlOrResourceUrl)("action", ctx.propAction, i0.ɵɵsanitizeUrl)("profile", ctx.propProfile, i0.ɵɵsanitizeResourceUrl)("innerHTML", ctx.propInnerHTML, i0.ɵɵsanitizeHtml)("title", ctx.propSafeTitle); + i0.ɵɵdomProperty("href", ctx.propHref, i0.ɵɵsanitizeUrlOrResourceUrl)("src", ctx.propSrc, i0.ɵɵsanitizeUrlOrResourceUrl)("action", ctx.propAction, i0.ɵɵsanitizeUrl)("profile", ctx.propProfile, i0.ɵɵsanitizeResourceUrl)("innerHTML", ctx.propInnerHTML, i0.ɵɵsanitizeHtml)("title", ctx.propSafeTitle); } } `; @@ -8306,7 +8306,7 @@ runInEachFileSystem((os: string) => { hostVars: 6, hostBindings: function FooCmp_HostBindings(rf, ctx) { if (rf & 2) { - i0.ɵɵhostProperty("src", ctx.srcProp)("href", ctx.hrefProp)("title", ctx.titleProp); + i0.ɵɵdomProperty("src", ctx.srcProp)("href", ctx.hrefProp)("title", ctx.titleProp); i0.ɵɵattribute("src", ctx.srcAttr)("href", ctx.hrefAttr)("title", ctx.titleAttr); } } @@ -9523,7 +9523,7 @@ runInEachFileSystem((os: string) => { // The `sandbox` is potentially a security-sensitive attribute of an