Skip to content

Commit 9720fb6

Browse files
authored
Fix/svelte reactivity (#1353)
* f * fix onUpdate * chg * upd * improve error * f * fix * f
1 parent 650a92b commit 9720fb6

27 files changed

+2319
-124
lines changed

.changeset/curly-mangos-sing.md

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
'@builder.io/mitosis': patch
3+
---
4+
5+
Fix: Svelte reactivity in onUpdate dependencies

packages/core/src/__tests__/__snapshots__/alpine.test.ts.snap

+38
Original file line numberDiff line numberDiff line change
@@ -2477,6 +2477,25 @@ exports[`Alpine.js > jsx > Javascript Test > showWithRootText 1`] = `
24772477
"
24782478
`;
24792479
2480+
exports[`Alpine.js > jsx > Javascript Test > signalsOnUpdate 1`] = `
2481+
"<style>
2482+
.div {
2483+
padding: 10px;
2484+
}
2485+
</style>
2486+
<div class=\\"test div\\" x-data=\\"myBasicComponent()\\">
2487+
<span x-html=\\"id\\"></span>
2488+
2489+
<span x-html=\\"foo.value.bar.baz\\"></span>
2490+
</div>
2491+
<script>
2492+
document.addEventListener(\\"alpine:init\\", () => {
2493+
Alpine.data(\\"myBasicComponent\\", () => ({}));
2494+
});
2495+
</script>
2496+
"
2497+
`;
2498+
24802499
exports[`Alpine.js > jsx > Javascript Test > spreadAttrs 1`] = `
24812500
"<input x-data=\\"myBasicComponent()\\" x-bind=\\"attrs\\" />
24822501
<script>
@@ -5187,6 +5206,25 @@ exports[`Alpine.js > jsx > Typescript Test > showWithRootText 1`] = `
51875206
"
51885207
`;
51895208
5209+
exports[`Alpine.js > jsx > Typescript Test > signalsOnUpdate 1`] = `
5210+
"<style>
5211+
.div {
5212+
padding: 10px;
5213+
}
5214+
</style>
5215+
<div class=\\"test div\\" x-data=\\"myBasicComponent()\\">
5216+
<span x-html=\\"id\\"></span>
5217+
5218+
<span x-html=\\"foo.bar.baz\\"></span>
5219+
</div>
5220+
<script>
5221+
document.addEventListener(\\"alpine:init\\", () => {
5222+
Alpine.data(\\"myBasicComponent\\", () => ({}));
5223+
});
5224+
</script>
5225+
"
5226+
`;
5227+
51905228
exports[`Alpine.js > jsx > Typescript Test > spreadAttrs 1`] = `
51915229
"<input x-data=\\"myBasicComponent()\\" x-bind=\\"attrs\\" />
51925230
<script>

packages/core/src/__tests__/__snapshots__/angular.import.test.ts.snap

+85
Original file line numberDiff line numberDiff line change
@@ -3869,6 +3869,44 @@ export class ShowRootTextModule {}
38693869
"
38703870
`;
38713871

3872+
exports[`Angular with Preserve Imports and File Extensions > jsx > Javascript Test > signalsOnUpdate 1`] = `
3873+
"import { NgModule } from \\"@angular/core\\";
3874+
import { CommonModule } from \\"@angular/common\\";
3875+
3876+
import { Component, Input } from \\"@angular/core\\";
3877+
3878+
@Component({
3879+
selector: \\"my-basic-component, MyBasicComponent\\",
3880+
template: \`
3881+
<div class=\\"test div\\">{{id}} {{foo.value.bar.baz}}</div>
3882+
\`,
3883+
styles: [
3884+
\`
3885+
.div {
3886+
padding: 10px;
3887+
}
3888+
\`,
3889+
],
3890+
})
3891+
export class MyBasicComponent {
3892+
@Input() id: any;
3893+
@Input() foo: any;
3894+
3895+
ngAfterContentChecked() {
3896+
console.log(\\"props.id changed\\", this.id);
3897+
console.log(\\"props.foo.value.bar.baz changed\\", this.foo.value.bar.baz);
3898+
}
3899+
}
3900+
3901+
@NgModule({
3902+
declarations: [MyBasicComponent],
3903+
imports: [CommonModule],
3904+
exports: [MyBasicComponent],
3905+
})
3906+
export class MyBasicComponentModule {}
3907+
"
3908+
`;
3909+
38723910
exports[`Angular with Preserve Imports and File Extensions > jsx > Javascript Test > spreadAttrs 1`] = `
38733911
"import { NgModule } from \\"@angular/core\\";
38743912
import { CommonModule } from \\"@angular/common\\";
@@ -8563,6 +8601,53 @@ export class ShowRootTextModule {}
85638601
"
85648602
`;
85658603

8604+
exports[`Angular with Preserve Imports and File Extensions > jsx > Typescript Test > signalsOnUpdate 1`] = `
8605+
"import { NgModule } from \\"@angular/core\\";
8606+
import { CommonModule } from \\"@angular/common\\";
8607+
8608+
import { Component, Input } from \\"@angular/core\\";
8609+
8610+
type Props = {
8611+
id: string;
8612+
foo: {
8613+
bar: {
8614+
baz: number;
8615+
};
8616+
};
8617+
};
8618+
8619+
@Component({
8620+
selector: \\"my-basic-component, MyBasicComponent\\",
8621+
template: \`
8622+
<div class=\\"test div\\">{{id}} {{foo.bar.baz}}</div>
8623+
\`,
8624+
styles: [
8625+
\`
8626+
.div {
8627+
padding: 10px;
8628+
}
8629+
\`,
8630+
],
8631+
})
8632+
export class MyBasicComponent {
8633+
@Input() id: Props[\\"id\\"];
8634+
@Input() foo: Props[\\"foo\\"];
8635+
8636+
ngAfterContentChecked() {
8637+
console.log(\\"props.id changed\\", this.id);
8638+
console.log(\\"props.foo.value.bar.baz changed\\", this.foo.bar.baz);
8639+
}
8640+
}
8641+
8642+
@NgModule({
8643+
declarations: [MyBasicComponent],
8644+
imports: [CommonModule],
8645+
exports: [MyBasicComponent],
8646+
})
8647+
export class MyBasicComponentModule {}
8648+
"
8649+
`;
8650+
85668651
exports[`Angular with Preserve Imports and File Extensions > jsx > Typescript Test > spreadAttrs 1`] = `
85678652
"import { NgModule } from \\"@angular/core\\";
85688653
import { CommonModule } from \\"@angular/common\\";

packages/core/src/__tests__/__snapshots__/angular.mapper.test.ts.snap

+87
Original file line numberDiff line numberDiff line change
@@ -3954,6 +3954,45 @@ export class ShowRootTextModule {}
39543954
"
39553955
`;
39563956

3957+
exports[`Angular with Import Mapper Tests > jsx > Javascript Test > signalsOnUpdate 1`] = `
3958+
"import { NgModule } from \\"@angular/core\\";
3959+
import { CommonModule } from \\"@angular/common\\";
3960+
3961+
import { Component, Input } from \\"@angular/core\\";
3962+
3963+
@Component({
3964+
selector: \\"my-basic-component, MyBasicComponent\\",
3965+
template: \`
3966+
<div class=\\"test div\\">{{id}} {{foo.value.bar.baz}}</div>
3967+
\`,
3968+
styles: [
3969+
\`
3970+
.div {
3971+
padding: 10px;
3972+
}
3973+
\`,
3974+
],
3975+
})
3976+
export class MyBasicComponent {
3977+
@Input() id: any;
3978+
@Input() foo: any;
3979+
3980+
ngAfterContentChecked() {
3981+
console.log(\\"props.id changed\\", this.id);
3982+
console.log(\\"props.foo.value.bar.baz changed\\", this.foo.value.bar.baz);
3983+
}
3984+
}
3985+
3986+
@NgModule({
3987+
declarations: [MyBasicComponent],
3988+
imports: [CommonModule],
3989+
exports: [MyBasicComponent],
3990+
bootstrap: [SomeOtherComponent],
3991+
})
3992+
export class MyBasicComponentModule {}
3993+
"
3994+
`;
3995+
39573996
exports[`Angular with Import Mapper Tests > jsx > Javascript Test > spreadAttrs 1`] = `
39583997
"import { NgModule } from \\"@angular/core\\";
39593998
import { CommonModule } from \\"@angular/common\\";
@@ -8749,6 +8788,54 @@ export class ShowRootTextModule {}
87498788
"
87508789
`;
87518790

8791+
exports[`Angular with Import Mapper Tests > jsx > Typescript Test > signalsOnUpdate 1`] = `
8792+
"import { NgModule } from \\"@angular/core\\";
8793+
import { CommonModule } from \\"@angular/common\\";
8794+
8795+
import { Component, Input } from \\"@angular/core\\";
8796+
8797+
type Props = {
8798+
id: string;
8799+
foo: {
8800+
bar: {
8801+
baz: number;
8802+
};
8803+
};
8804+
};
8805+
8806+
@Component({
8807+
selector: \\"my-basic-component, MyBasicComponent\\",
8808+
template: \`
8809+
<div class=\\"test div\\">{{id}} {{foo.bar.baz}}</div>
8810+
\`,
8811+
styles: [
8812+
\`
8813+
.div {
8814+
padding: 10px;
8815+
}
8816+
\`,
8817+
],
8818+
})
8819+
export class MyBasicComponent {
8820+
@Input() id: Props[\\"id\\"];
8821+
@Input() foo: Props[\\"foo\\"];
8822+
8823+
ngAfterContentChecked() {
8824+
console.log(\\"props.id changed\\", this.id);
8825+
console.log(\\"props.foo.value.bar.baz changed\\", this.foo.bar.baz);
8826+
}
8827+
}
8828+
8829+
@NgModule({
8830+
declarations: [MyBasicComponent],
8831+
imports: [CommonModule],
8832+
exports: [MyBasicComponent],
8833+
bootstrap: [SomeOtherComponent],
8834+
})
8835+
export class MyBasicComponentModule {}
8836+
"
8837+
`;
8838+
87528839
exports[`Angular with Import Mapper Tests > jsx > Typescript Test > spreadAttrs 1`] = `
87538840
"import { NgModule } from \\"@angular/core\\";
87548841
import { CommonModule } from \\"@angular/common\\";

0 commit comments

Comments
 (0)