Merge pull request #163 from angular/main

Create a new pull request by comparing changes across two branches

.github/workflows/scorecard.yml

@@ -30,7 +30,7 @@ jobs:
           persist-credentials: false
 
       - name: 'Run analysis'
-        uses: ossf/scorecard-action@483ef80eb98fb506c348f7d62e28055e49fe2398 # v2.3.0
+        uses: ossf/scorecard-action@0864cf19026789058feabb7e87baa5f140aac736 # v2.3.1
         with:
           results_file: results.sarif
           results_format: sarif
@@ -39,14 +39,14 @@ jobs:
 
       # Upload the results as artifacts.
       - name: 'Upload artifact'
-        uses: actions/upload-artifact@a8a3f3ad30e3422c9c7b888a15615d19a852ae32 # v3.1.3
+        uses: actions/upload-artifact@c7d193f32edcb7bfad88892161225aeda64e9392 # v4.0.0
         with:
           name: SARIF file
           path: results.sarif
           retention-days: 5
 
       # Upload the results to GitHub's code scanning dashboard.
       - name: 'Upload to code-scanning'
-        uses: github/codeql-action/upload-sarif@0116bc2df50751f9724a2e35ef1f24d22f90e4e1 # v2.22.3
+        uses: github/codeql-action/upload-sarif@b374143c1149a9115d881581d29b8390bbcbb59c # v3.22.11
         with:
           sarif_file: results.sarif

aio/content/cli/help/add.json

@@ -22,6 +22,9 @@
     {
       "name": "dry-run",
       "type": "boolean",
+      "aliases": [
+        "d"
+      ],
       "default": false,
       "description": "Run through and reports activity without writing out results."
     },

aio/content/cli/help/build-info.json

@@ -1,4 +1,4 @@
 {
   "branchName": "refs/heads/main",
-  "sha": "8c844e03ebe99ac0fda6d1e2fa8d57d6031f1562"
+  "sha": "9ddd673f70f415f59d953fd72f05ebd32f92a60b"
 }

aio/content/cli/help/build.json

@@ -148,7 +148,7 @@
     {
       "name": "output-path",
       "type": "string",
-      "description": "The full path for the new output directory, relative to the current workspace."
+      "description": "Specify the output path relative to workspace root."
     },
     {
       "name": "poll",

aio/content/cli/help/generate.json

@@ -16,6 +16,9 @@
     {
       "name": "dry-run",
       "type": "boolean",
+      "aliases": [
+        "d"
+      ],
       "default": false,
       "description": "Run through and reports activity without writing out results."
     },

aio/content/cli/help/new.json

@@ -43,6 +43,9 @@
     {
       "name": "dry-run",
       "type": "boolean",
+      "aliases": [
+        "d"
+      ],
       "default": false,
       "description": "Run through and reports activity without writing out results."
     },

devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/directive-forest/component-data-source/index.ts

@@ -176,7 +176,7 @@ export class ComponentDataSource extends DataSource<FlatNode> {
       this._treeControl.expansionModel.changed,
       this._flattenedData,
     ];
-    return merge(...changes)
+    return merge<unknown[]>(...changes)
         .pipe(
             map(() => {
               this._expandedData.next(

devtools/projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/property-resolver/property-data-source.ts

@@ -69,7 +69,7 @@ export class PropertyDataSource extends DataSource<FlatNode> {
     const changes =
         [collectionViewer.viewChange, this._treeControl.expansionModel.changed, this._data];
 
-    return merge(...changes).pipe(map(() => {
+    return merge<unknown[]>(...changes).pipe(map(() => {
       this._expandedData.next(
           this._treeFlattener.expandFlattenedNodes(this.data, this._treeControl));
       return this._expandedData.value;

docs/DEVELOPER.md

@@ -26,8 +26,9 @@ following products on your development machine:
   **Windows Users**: Git Bash or an equivalent shell is required\
   *Windows Powershell and cmd shells are not supported [#46780](https://github.com/angular/angular/issues/46780) so some commands might fail*
 
-* [Node.js](https://nodejs.org), (version specified in the engines field of [`package.json`](../package.json)) which is used to run a development web server,
-  run tests, and generate distributable files.
+* [Node.js](https://nodejs.org), (version specified in [`.nvmrc`](../.nvmrc)) which is used to run a development web server,
+  run tests, and generate distributable files.  
+  `.nvmrc` is read by [nvm](https://github.com/nvm-sh/nvm) commands like `nvm install` and `nvm use`.
 
 * [Yarn](https://yarnpkg.com) (version specified in the engines field of [`package.json`](../package.json)) which is used to install dependencies.
 

modules/benchmarks/src/expanding_rows/expanding_row_details_caption.ts

@@ -35,7 +35,7 @@ export class ExpandingRowDetailsCaption implements OnDestroy {
   @Input() color: string = 'blue';
 
   /** This is triggered when this component is destroyed. */
-  private readonly onDestroy = new Subject();
+  private readonly onDestroy = new Subject<void>();
 
   /**
    * We need a reference to parent cfc-expanding-row component here to hide

package.json

@@ -126,7 +126,7 @@
     "rollup": "~2.79.0",
     "rollup-plugin-preserve-shebang": "^1.0.1",
     "rollup-plugin-sourcemaps": "^0.6.3",
-    "rxjs": "^6.6.7",
+    "rxjs": "^7.0.0",
     "selenium-webdriver": "3.5.0",
     "selenium-webdriver4": "npm:[email protected]",
     "semver-dsl": "^1.0.1",

packages/common/http/test/client_spec.ts

@@ -106,11 +106,11 @@ describe('HttpClient', () => {
     });
     it('that returns a stream of events', done => {
       client.get('/test', {observe: 'events'}).pipe(toArray()).toPromise().then(events => {
-        expect(events.length).toBe(2);
+        expect(events!.length).toBe(2);
         let x = HttpResponse;
-        expect(events[0].type).toBe(HttpEventType.Sent);
-        expect(events[1].type).toBe(HttpEventType.Response);
-        expect(events[1] instanceof HttpResponse).toBeTruthy();
+        expect(events![0].type).toBe(HttpEventType.Sent);
+        expect(events![1].type).toBe(HttpEventType.Response);
+        expect(events![1] instanceof HttpResponse).toBeTruthy();
         done();
       });
       backend.expectOne('/test').flush({'data': 'hello world'});

packages/common/http/test/fetch_spec.ts

@@ -15,18 +15,17 @@ import {HttpDownloadProgressEvent, HttpErrorResponse, HttpHeaderResponse, HttpPa
 import {FetchBackend, FetchFactory} from '../src/fetch';
 
 function trackEvents(obs: Observable<any>): Promise<any[]> {
-  return obs
-      .pipe(
-          // We don't want the promise to fail on HttpErrorResponse
-          catchError((e) => of(e)),
-          scan(
-              (acc, event) => {
-                acc.push(event);
-                return acc;
-              },
-              [] as any[]),
-          )
-      .toPromise();
+  return obs.pipe(
+                // We don't want the promise to fail on HttpErrorResponse
+                catchError((e) => of(e)),
+                scan(
+                    (acc, event) => {
+                      acc.push(event);
+                      return acc;
+                    },
+                    [] as any[]),
+                )
+             .toPromise() as Promise<any[]>;
 }
 
 const TEST_POST = new HttpRequest('POST', '/test', 'some body', {

packages/compiler-cli/test/compliance/test_cases/r3_compiler_compliance/elements/GOLDEN_PARTIAL.js

@@ -684,3 +684,37 @@ export declare class MyModule {
     static ɵinj: i0.ɵɵInjectorDeclaration<MyModule>;
 }
 
+/****************************************************************************************************
+ * PARTIAL FILE: iframe_attrs.js
+ ****************************************************************************************************/
+import { Component } from '@angular/core';
+import * as i0 from "@angular/core";
+export class MyComponent {
+    constructor() {
+        this.fullscreen = 'false';
+    }
+}
+MyComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "0.0.0-PLACEHOLDER", ngImport: i0, type: MyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+MyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "0.0.0-PLACEHOLDER", type: MyComponent, selector: "my-component", ngImport: i0, template: `
+  <iframe allow="camera 'none'" [attr.fetchpriority]="'low'" [attr.allowfullscreen]="fullscreen"></iframe>
+  `, isInline: true });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "0.0.0-PLACEHOLDER", ngImport: i0, type: MyComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'my-component',
+                    template: `
+  <iframe allow="camera 'none'" [attr.fetchpriority]="'low'" [attr.allowfullscreen]="fullscreen"></iframe>
+  `
+                }]
+        }] });
+
+/****************************************************************************************************
+ * PARTIAL FILE: iframe_attrs.d.ts
+ ****************************************************************************************************/
+import * as i0 from "@angular/core";
+export declare class MyComponent {
+    fullscreen: string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MyComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MyComponent, "my-component", never, {}, {}, never, never, false, never>;
+}
+

packages/compiler-cli/test/compliance/test_cases/r3_compiler_compliance/elements/TEST_CASES.json

@@ -254,6 +254,17 @@
           "failureMessage": "Incorrect generated template."
         }
       ]
+    },
+    {
+      "description": "should validate iframe attributes",
+      "inputFiles": [
+        "iframe_attrs.ts"
+      ],
+      "expectations": [
+        {
+          "failureMessage": "Incorrect generated template."
+        }
+      ]
     }
   ]
 }

packages/compiler-cli/test/compliance/test_cases/r3_compiler_compliance/elements/iframe_attrs.js

@@ -0,0 +1,8 @@
+consts: [["allow", "camera 'none'"]],
+template: function MyComponent_Template(rf, ctx) {
+  if (rf & 1) {
+    i0.ɵɵelement(0, "iframe", 0);
+  } if (rf & 2) {
+    i0.ɵɵattribute("fetchpriority", "low", i0.ɵɵvalidateIframeAttribute)("allowfullscreen", ctx.fullscreen, i0.ɵɵvalidateIframeAttribute);
+  }
+}

packages/compiler-cli/test/compliance/test_cases/r3_compiler_compliance/elements/iframe_attrs.ts

@@ -0,0 +1,11 @@
+import {Component} from '@angular/core';
+
+@Component({
+  selector: 'my-component',
+  template: `
+  <iframe allow="camera 'none'" [attr.fetchpriority]="'low'" [attr.allowfullscreen]="fullscreen"></iframe>
+  `
+})
+export class MyComponent {
+  fullscreen = 'false';
+}

packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/attribute_bindings/GOLDEN_PARTIAL.js

@@ -370,3 +370,50 @@ export declare class MyModule {
     static ɵinj: i0.ɵɵInjectorDeclaration<MyModule>;
 }
 
+/****************************************************************************************************
+ * PARTIAL FILE: duplicate_bindings.js
+ ****************************************************************************************************/
+import { Component } from '@angular/core';
+import * as i0 from "@angular/core";
+export class MyComponent {
+}
+MyComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "0.0.0-PLACEHOLDER", ngImport: i0, type: MyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+MyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "0.0.0-PLACEHOLDER", type: MyComponent, isStandalone: true, selector: "my-component", ngImport: i0, template: `
+    <div aria-label="hello" aria-label="hi"></div>
+    <div style="width: 0" style="height: 0">
+    <div class="cls1" class="cls2"></div>
+    <div [attr.aria-label]="value1" [attr.aria-label]="value2"></div>
+    <div [tabindex]="value1" [tabindex]="value2"></div>
+    <div [class]="value1" [class]="value2"></div>
+    <div [style]="value1" [style]="value2"></div>
+    <div (click)="$event.stopPropagation()" (click)="$event.preventDefault()"></div>
+  `, isInline: true });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "0.0.0-PLACEHOLDER", ngImport: i0, type: MyComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'my-component',
+                    standalone: true,
+                    template: `
+    <div aria-label="hello" aria-label="hi"></div>
+    <div style="width: 0" style="height: 0">
+    <div class="cls1" class="cls2"></div>
+    <div [attr.aria-label]="value1" [attr.aria-label]="value2"></div>
+    <div [tabindex]="value1" [tabindex]="value2"></div>
+    <div [class]="value1" [class]="value2"></div>
+    <div [style]="value1" [style]="value2"></div>
+    <div (click)="$event.stopPropagation()" (click)="$event.preventDefault()"></div>
+  `,
+                }]
+        }] });
+
+/****************************************************************************************************
+ * PARTIAL FILE: duplicate_bindings.d.ts
+ ****************************************************************************************************/
+import * as i0 from "@angular/core";
+export declare class MyComponent {
+    value1: any;
+    value2: any;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MyComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MyComponent, "my-component", never, {}, {}, never, never, true, never>;
+}
+

packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/attribute_bindings/TEST_CASES.json

@@ -64,14 +64,7 @@
       ],
       "expectations": [
         {
-          "failureMessage": "Incorrect template",
-          "files": [
-            {
-              "expected": "chain_multiple_bindings_for_multiple_elements_template.js",
-              "templatePipelineExpected": "chain_multiple_bindings_for_multiple_elements_template.pipeline.js",
-              "generated": "chain_multiple_bindings_for_multiple_elements.js"
-            }
-          ]
+          "failureMessage": "Incorrect template"
         }
       ]
     },
@@ -82,14 +75,7 @@
       ],
       "expectations": [
         {
-          "failureMessage": "Incorrect template",
-          "files": [
-            {
-              "expected": "chain_multiple_bindings_with_child_elements_template.js",
-              "templatePipelineExpected": "chain_multiple_bindings_with_child_elements_template.pipeline.js",
-              "generated": "chain_multiple_bindings_with_child_elements.js"
-            }
-          ]
+          "failureMessage": "Incorrect template"
         }
       ]
     },
@@ -124,6 +110,17 @@
           ]
         }
       ]
+    },
+    {
+      "description": "should handle duplicate bindings",
+      "inputFiles": [
+        "duplicate_bindings.ts"
+      ],
+      "expectations": [
+        {
+          "failureMessage": "Incorrect handling of duplicate bindings"
+        }
+      ]
     }
   ]
-}
+}

packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_bindings/attribute_bindings/duplicate_bindings.js

@@ -0,0 +1,21 @@
+consts: [["aria-label", "hello", "aria-label", "hi"], [2, "height", "0"], [1, "cls2"], [3, "tabindex"], [3, "click"]],
+template: function MyComponent_Template(rf, ctx) { 
+  if (rf & 1) {
+    i0.ɵɵelement(0, "div", 0);
+    i0.ɵɵelementStart(1, "div", 1);
+    i0.ɵɵelement(2, "div", 2)(3, "div")(4, "div", 3)(5, "div")(6, "div");
+    i0.ɵɵelementStart(7, "div", 4);
+    i0.ɵɵlistener("click", function MyComponent_Template_div_click_7_listener($event) { return $event.stopPropagation(); })("click", function MyComponent_Template_div_click_7_listener($event) { return $event.preventDefault(); });
+    i0.ɵɵelementEnd()();
+  }
+  if (rf & 2) {
+    i0.ɵɵadvance(3);
+    i0.ɵɵattribute("aria-label", ctx.value1)("aria-label", ctx.value2);
+    i0.ɵɵadvance(1);
+    i0.ɵɵproperty("tabindex", ctx.value1)("tabindex", ctx.value2);
+    i0.ɵɵadvance(1);
+    i0.ɵɵclassMap(ctx.value2);
+    i0.ɵɵadvance(1);
+    i0.ɵɵstyleMap(ctx.value2);
+  }
+}