feat(compiler-cli): Adds warning for prefetch without main defer trigger

Emit a warning when an `@defer` block uses `prefetch` triggers but does not define an explicit main trigger.

Closes angular#52746

Author: SkyZeroZx

packages/compiler-cli/src/ngtsc/typecheck/extended/checks/defer_trigger_misconfiguration/index.ts

@@ -135,6 +135,19 @@ class DeferTriggerMisconfiguration extends TemplateCheckWithVisitor<ErrorCode.DE
       }
     }
 
+    // `prefetch` without an explicit main trigger defaults the main trigger to `idle`,
+    if (mains.length === 0 && prefetches.length > 0) {
+      const msg =
+        `Define a main trigger when using 'prefetch' triggers. ` +
+        `Without an explicit main trigger, @defer defaults to 'idle' and prefetch may have no effect.`;
+      diags.push(
+        ctx.makeTemplateDiagnostic(
+          node.sourceSpan,
+          formatExtendedError(ErrorCode.DEFER_TRIGGER_MISCONFIGURATION, msg),
+        ),
+      );
+    }
+
     // If there is exactly one main and at least one prefetch, compare them.
     if (mains.length === 1 && prefetches.length > 0) {
       const main = mains[0];

packages/compiler-cli/src/ngtsc/typecheck/extended/test/checks/defer_trigger_misconfiguration/defer_trigger_misconfiguration_spec.ts

@@ -180,5 +180,33 @@ runInEachFileSystem(() => {
       expect(diags[0].category).toBe(ts.DiagnosticCategory.Warning);
       expect(diags[0].code).toBe(ngErrorCode(ErrorCode.DEFER_TRIGGER_MISCONFIGURATION));
     });
+
+    it('should emit when prefetch trigger is configured without a main trigger', () => {
+      const diags = getDiags(`@defer (prefetch on viewport(ref)) { <div></div> }`);
+      expect(diags.length).toBe(1);
+      expect(diags[0].category).toBe(ts.DiagnosticCategory.Warning);
+      expect(diags[0].code).toBe(ngErrorCode(ErrorCode.DEFER_TRIGGER_MISCONFIGURATION));
+    });
+
+    it('should emit when prefetch timer is configured without a main trigger', () => {
+      const diags = getDiags(`@defer (prefetch on timer(500ms)) { <div></div> }`);
+      expect(diags.length).toBe(1);
+      expect(diags[0].category).toBe(ts.DiagnosticCategory.Warning);
+      expect(diags[0].code).toBe(ngErrorCode(ErrorCode.DEFER_TRIGGER_MISCONFIGURATION));
+    });
+
+    it('should emit when prefetch idle is configured without a main trigger', () => {
+      const diags = getDiags(`@defer (prefetch on idle(500)) { <div></div> }`);
+      expect(diags.length).toBe(1);
+      expect(diags[0].category).toBe(ts.DiagnosticCategory.Warning);
+      expect(diags[0].code).toBe(ngErrorCode(ErrorCode.DEFER_TRIGGER_MISCONFIGURATION));
+    });
+
+    it('should emit when prefetch when is configured without a main trigger', () => {
+      const diags = getDiags(`@defer (prefetch when true) { <div></div> }`);
+      expect(diags.length).toBe(1);
+      expect(diags[0].category).toBe(ts.DiagnosticCategory.Warning);
+      expect(diags[0].code).toBe(ngErrorCode(ErrorCode.DEFER_TRIGGER_MISCONFIGURATION));
+    });
   });
 });

packages/language-service/test/quick_info_spec.ts

@@ -770,7 +770,7 @@ describe('quick info', () => {
 
           it('prefetch (when)', () => {
             expectQuickInfo({
-              templateOverride: `@defer (prefet¦ch when title) { }`,
+              templateOverride: `@defer (on idle; prefet¦ch when title) { }`,
               expectedSpanText: 'prefetch',
               expectedDisplayString: '(keyword) prefetch',
             });
@@ -794,7 +794,7 @@ describe('quick info', () => {
 
           it('prefetch (on)', () => {
             expectQuickInfo({
-              templateOverride: `@defer (prefet¦ch on immediate) { }`,
+              templateOverride: `@defer (on idle; prefet¦ch on immediate) { }`,
               expectedSpanText: 'prefetch',
               expectedDisplayString: '(keyword) prefetch',
             });