fix(vue2): context as root work no error notice (BuilderIO#987)

* fix(vue2): context as root work no error notice * style: fmt code * test: update snapshot
jesse-forked · Jan 23, 2023 · b62dac0 · b62dac0
1 parent 51746d3
commit b62dac0
Show file tree

Hide file tree

Showing 22 changed files with 1,724 additions and 20 deletions.
diff --git a/packages/core/src/__tests__/__snapshots__/alpine.test.ts.snap b/packages/core/src/__tests__/__snapshots__/alpine.test.ts.snap
@@ -1571,6 +1571,20 @@ exports[`Alpine.js > jsx > Javascript Test > componentWithContext 1`] = `
 "
 `;
 
+exports[`Alpine.js > jsx > Javascript Test > componentWithContextMultiRoot 1`] = `
+"<div x-data=\\"componentWithContext()\\">
+  <div><span x-html=\\"foo.value\\"></span></div>
+
+  <div>other</div>
+</div>
+<script>
+  document.addEventListener(\\"alpine:init\\", () => {
+    Alpine.data(\\"componentWithContext\\", () => ({}));
+  });
+</script>
+"
+`;
+
 exports[`Alpine.js > jsx > Javascript Test > contentState 1`] = `
 "<div x-data=\\"renderContent()\\">setting context</div>
 <script>
@@ -4024,6 +4038,20 @@ exports[`Alpine.js > jsx > Typescript Test > componentWithContext 1`] = `
 "
 `;
 
+exports[`Alpine.js > jsx > Typescript Test > componentWithContextMultiRoot 1`] = `
+"<div x-data=\\"componentWithContext()\\">
+  <div><span x-html=\\"foo.value\\"></span></div>
+
+  <div>other</div>
+</div>
+<script>
+  document.addEventListener(\\"alpine:init\\", () => {
+    Alpine.data(\\"componentWithContext\\", () => ({}));
+  });
+</script>
+"
+`;
+
 exports[`Alpine.js > jsx > Typescript Test > contentState 1`] = `
 "<div x-data=\\"renderContent()\\">setting context</div>
 <script>

diff --git a/packages/core/src/__tests__/__snapshots__/angular.import.test.ts.snap b/packages/core/src/__tests__/__snapshots__/angular.import.test.ts.snap
@@ -2614,6 +2614,44 @@ export class ComponentWithContextModule {}
 "
 `;
 
+exports[`Angular with Preserve Imports and File Extensions > jsx > Javascript Test > componentWithContextMultiRoot 1`] = `
+"import { NgModule } from \\"@angular/core\\";
+import { CommonModule } from \\"@angular/common\\";
+
+import { Component, Input } from \\"@angular/core\\";
+
+export interface ComponentWithContextProps {
+  content: string;
+}
+
+import Context1 from \\"@dummy/1\\";
+import Context2 from \\"@dummy/2\\";
+
+@Component({
+  selector: \\"component-with-context, ComponentWithContext\\",
+  template: \`
+    <ng-container>
+      <ng-container>{{foo.value}}</ng-container>
+
+      <div>other</div>
+    </ng-container>
+  \`,
+})
+export class ComponentWithContext {
+  @Input() content: ComponentWithContextProps[\\"content\\"];
+
+  constructor(public foo: Context1) {}
+}
+
+@NgModule({
+  declarations: [ComponentWithContext],
+  imports: [CommonModule],
+  exports: [ComponentWithContext],
+})
+export class ComponentWithContextModule {}
+"
+`;
+
 exports[`Angular with Preserve Imports and File Extensions > jsx > Javascript Test > contentState 1`] = `
 "import { NgModule } from \\"@angular/core\\";
 import { CommonModule } from \\"@angular/common\\";
@@ -6904,6 +6942,44 @@ export class ComponentWithContextModule {}
 "
 `;
 
+exports[`Angular with Preserve Imports and File Extensions > jsx > Typescript Test > componentWithContextMultiRoot 1`] = `
+"import { NgModule } from \\"@angular/core\\";
+import { CommonModule } from \\"@angular/common\\";
+
+import { Component, Input } from \\"@angular/core\\";
+
+export interface ComponentWithContextProps {
+  content: string;
+}
+
+import Context1 from \\"@dummy/1\\";
+import Context2 from \\"@dummy/2\\";
+
+@Component({
+  selector: \\"component-with-context, ComponentWithContext\\",
+  template: \`
+    <ng-container>
+      <ng-container>{{foo.value}}</ng-container>
+
+      <div>other</div>
+    </ng-container>
+  \`,
+})
+export class ComponentWithContext {
+  @Input() content: ComponentWithContextProps[\\"content\\"];
+
+  constructor(public foo: Context1) {}
+}
+
+@NgModule({
+  declarations: [ComponentWithContext],
+  imports: [CommonModule],
+  exports: [ComponentWithContext],
+})
+export class ComponentWithContextModule {}
+"
+`;
+
 exports[`Angular with Preserve Imports and File Extensions > jsx > Typescript Test > contentState 1`] = `
 "import { NgModule } from \\"@angular/core\\";
 import { CommonModule } from \\"@angular/common\\";

diff --git a/packages/core/src/__tests__/__snapshots__/angular.mapper.test.ts.snap b/packages/core/src/__tests__/__snapshots__/angular.mapper.test.ts.snap
@@ -2662,6 +2662,45 @@ export class ComponentWithContextModule {}
 "
 `;
 
+exports[`Angular with Import Mapper Tests > jsx > Javascript Test > componentWithContextMultiRoot 1`] = `
+"import { NgModule } from \\"@angular/core\\";
+import { CommonModule } from \\"@angular/common\\";
+
+import { Component, Input } from \\"@angular/core\\";
+
+export interface ComponentWithContextProps {
+  content: string;
+}
+
+import Context1 from \\"@dummy/1\\";
+import Context2 from \\"@dummy/2\\";
+
+@Component({
+  selector: \\"component-with-context, ComponentWithContext\\",
+  template: \`
+    <ng-container>
+      <ng-container>{{foo.value}}</ng-container>
+
+      <div>other</div>
+    </ng-container>
+  \`,
+})
+export class ComponentWithContext {
+  @Input() content: ComponentWithContextProps[\\"content\\"];
+
+  constructor(public foo: Context1) {}
+}
+
+@NgModule({
+  declarations: [ComponentWithContext],
+  imports: [CommonModule],
+  exports: [ComponentWithContext],
+  bootstrap: [SomeOtherComponent],
+})
+export class ComponentWithContextModule {}
+"
+`;
+
 exports[`Angular with Import Mapper Tests > jsx > Javascript Test > contentState 1`] = `
 "import { NgModule } from \\"@angular/core\\";
 import { CommonModule } from \\"@angular/common\\";
@@ -7041,6 +7080,45 @@ export class ComponentWithContextModule {}
 "
 `;
 
+exports[`Angular with Import Mapper Tests > jsx > Typescript Test > componentWithContextMultiRoot 1`] = `
+"import { NgModule } from \\"@angular/core\\";
+import { CommonModule } from \\"@angular/common\\";
+
+import { Component, Input } from \\"@angular/core\\";
+
+export interface ComponentWithContextProps {
+  content: string;
+}
+
+import Context1 from \\"@dummy/1\\";
+import Context2 from \\"@dummy/2\\";
+
+@Component({
+  selector: \\"component-with-context, ComponentWithContext\\",
+  template: \`
+    <ng-container>
+      <ng-container>{{foo.value}}</ng-container>
+
+      <div>other</div>
+    </ng-container>
+  \`,
+})
+export class ComponentWithContext {
+  @Input() content: ComponentWithContextProps[\\"content\\"];
+
+  constructor(public foo: Context1) {}
+}
+
+@NgModule({
+  declarations: [ComponentWithContext],
+  imports: [CommonModule],
+  exports: [ComponentWithContext],
+  bootstrap: [SomeOtherComponent],
+})
+export class ComponentWithContextModule {}
+"
+`;
+
 exports[`Angular with Import Mapper Tests > jsx > Typescript Test > contentState 1`] = `
 "import { NgModule } from \\"@angular/core\\";
 import { CommonModule } from \\"@angular/common\\";

diff --git a/packages/core/src/__tests__/__snapshots__/angular.test.ts.snap b/packages/core/src/__tests__/__snapshots__/angular.test.ts.snap
@@ -5372,6 +5372,85 @@ export class ComponentWithContextModule {}
 "
 `;
 
+exports[`Angular > jsx > Javascript Test > componentWithContextMultiRoot 1`] = `
+"import { NgModule } from \\"@angular/core\\";
+import { CommonModule } from \\"@angular/common\\";
+
+import { Component, Input } from \\"@angular/core\\";
+
+export interface ComponentWithContextProps {
+  content: string;
+}
+
+import Context1 from \\"@dummy/1\\";
+import Context2 from \\"@dummy/2\\";
+
+@Component({
+  selector: \\"component-with-context, ComponentWithContext\\",
+  template: \`
+    <ng-container>
+      <ng-container>{{foo.value}}</ng-container>
+
+      <div>other</div>
+    </ng-container>
+  \`,
+})
+export class ComponentWithContext {
+  @Input() content: ComponentWithContextProps[\\"content\\"];
+
+  constructor(public foo: Context1) {}
+}
+
+@NgModule({
+  declarations: [ComponentWithContext],
+  imports: [CommonModule],
+  exports: [ComponentWithContext],
+})
+export class ComponentWithContextModule {}
+"
+`;
+
+exports[`Angular > jsx > Javascript Test > componentWithContextMultiRoot 2`] = `
+"import { NgModule } from \\"@angular/core\\";
+import { CommonModule } from \\"@angular/common\\";
+
+import { Component, Input } from \\"@angular/core\\";
+import { CommonModule } from \\"@angular/common\\";
+
+export interface ComponentWithContextProps {
+  content: string;
+}
+
+import Context1 from \\"@dummy/1\\";
+import Context2 from \\"@dummy/2\\";
+
+@Component({
+  selector: \\"component-with-context, ComponentWithContext\\",
+  template: \`
+    <ng-container>
+      <ng-container>{{foo.value}}</ng-container>
+
+      <div>other</div>
+    </ng-container>
+  \`,
+  standalone: true,
+  imports: [CommonModule],
+})
+export class ComponentWithContext {
+  @Input() content: ComponentWithContextProps[\\"content\\"];
+
+  constructor(public foo: Context1) {}
+}
+
+@NgModule({
+  declarations: [ComponentWithContext],
+  imports: [CommonModule],
+  exports: [ComponentWithContext],
+})
+export class ComponentWithContextModule {}
+"
+`;
+
 exports[`Angular > jsx > Javascript Test > contentState 1`] = `
 "import { NgModule } from \\"@angular/core\\";
 import { CommonModule } from \\"@angular/common\\";
@@ -14209,6 +14288,85 @@ export class ComponentWithContextModule {}
 "
 `;
 
+exports[`Angular > jsx > Typescript Test > componentWithContextMultiRoot 1`] = `
+"import { NgModule } from \\"@angular/core\\";
+import { CommonModule } from \\"@angular/common\\";
+
+import { Component, Input } from \\"@angular/core\\";
+
+export interface ComponentWithContextProps {
+  content: string;
+}
+
+import Context1 from \\"@dummy/1\\";
+import Context2 from \\"@dummy/2\\";
+
+@Component({
+  selector: \\"component-with-context, ComponentWithContext\\",
+  template: \`
+    <ng-container>
+      <ng-container>{{foo.value}}</ng-container>
+
+      <div>other</div>
+    </ng-container>
+  \`,
+})
+export class ComponentWithContext {
+  @Input() content: ComponentWithContextProps[\\"content\\"];
+
+  constructor(public foo: Context1) {}
+}
+
+@NgModule({
+  declarations: [ComponentWithContext],
+  imports: [CommonModule],
+  exports: [ComponentWithContext],
+})
+export class ComponentWithContextModule {}
+"
+`;
+
+exports[`Angular > jsx > Typescript Test > componentWithContextMultiRoot 2`] = `
+"import { NgModule } from \\"@angular/core\\";
+import { CommonModule } from \\"@angular/common\\";
+
+import { Component, Input } from \\"@angular/core\\";
+import { CommonModule } from \\"@angular/common\\";
+
+export interface ComponentWithContextProps {
+  content: string;
+}
+
+import Context1 from \\"@dummy/1\\";
+import Context2 from \\"@dummy/2\\";
+
+@Component({
+  selector: \\"component-with-context, ComponentWithContext\\",
+  template: \`
+    <ng-container>
+      <ng-container>{{foo.value}}</ng-container>
+
+      <div>other</div>
+    </ng-container>
+  \`,
+  standalone: true,
+  imports: [CommonModule],
+})
+export class ComponentWithContext {
+  @Input() content: ComponentWithContextProps[\\"content\\"];
+
+  constructor(public foo: Context1) {}
+}
+
+@NgModule({
+  declarations: [ComponentWithContext],
+  imports: [CommonModule],
+  exports: [ComponentWithContext],
+})
+export class ComponentWithContextModule {}
+"
+`;
+
 exports[`Angular > jsx > Typescript Test > contentState 1`] = `
 "import { NgModule } from \\"@angular/core\\";
 import { CommonModule } from \\"@angular/common\\";