fix(@schematics/angular): set builders assets option correctly for new applications

packages/angular/pwa/pwa/files/assets/manifest.webmanifest

@@ -8,49 +8,49 @@
   "start_url": "./",
   "icons": [
     {
-      "src": "assets/icons/icon-72x72.png",
+      "src": "<%= iconsPath %>/icon-72x72.png",
       "sizes": "72x72",
       "type": "image/png",
       "purpose": "maskable any"
     },
     {
-      "src": "assets/icons/icon-96x96.png",
+      "src": "<%= iconsPath %>/icon-96x96.png",
       "sizes": "96x96",
       "type": "image/png",
       "purpose": "maskable any"
     },
     {
-      "src": "assets/icons/icon-128x128.png",
+      "src": "<%= iconsPath %>/icon-128x128.png",
       "sizes": "128x128",
       "type": "image/png",
       "purpose": "maskable any"
     },
     {
-      "src": "assets/icons/icon-144x144.png",
+      "src": "<%= iconsPath %>/icon-144x144.png",
       "sizes": "144x144",
       "type": "image/png",
       "purpose": "maskable any"
     },
     {
-      "src": "assets/icons/icon-152x152.png",
+      "src": "<%= iconsPath %>/icon-152x152.png",
       "sizes": "152x152",
       "type": "image/png",
       "purpose": "maskable any"
     },
     {
-      "src": "assets/icons/icon-192x192.png",
+      "src": "<%= iconsPath %>/icon-192x192.png",
       "sizes": "192x192",
       "type": "image/png",
       "purpose": "maskable any"
     },
     {
-      "src": "assets/icons/icon-384x384.png",
+      "src": "<%= iconsPath %>/icon-384x384.png",
       "sizes": "384x384",
       "type": "image/png",
       "purpose": "maskable any"
     },
     {
-      "src": "assets/icons/icon-512x512.png",
+      "src": "<%= iconsPath %>/icon-512x512.png",
       "sizes": "512x512",
       "type": "image/png",
       "purpose": "maskable any"

packages/angular/pwa/pwa/index.ts

@@ -130,7 +130,7 @@ export default function (options: PwaOptions): Rule {
 
     await writeWorkspace(host, workspace);
     let assetsDir = posix.join(sourcePath, 'assets');
-
+    let iconsPath: string;
     if (host.exists(assetsDir)) {
       // Add manifest to asset configuration
       const assetEntry = posix.join(
@@ -148,13 +148,17 @@ export default function (options: PwaOptions): Rule {
           target.options = { assets: [assetEntry] };
         }
       }
+      iconsPath = 'assets';
     } else {
       assetsDir = posix.join(project.root, 'public');
+      iconsPath = 'icons';
     }
 
     return chain([
       externalSchematic('@schematics/angular', 'service-worker', swOptions),
-      mergeWith(apply(url('./files/assets'), [template({ ...options }), move(assetsDir)])),
+      mergeWith(
+        apply(url('./files/assets'), [template({ ...options, iconsPath }), move(assetsDir)]),
+      ),
       ...[...indexFiles].map((path) => updateIndexFile(path)),
     ]);
   };

packages/angular/pwa/pwa/index_spec.ts

@@ -63,6 +63,15 @@ describe('PWA Schematic', () => {
     });
   });
 
+  it('should reference the icons in the manifest correctly', async () => {
+    const tree = await schematicRunner.runSchematic('ng-add', defaultOptions, appTree);
+    const manifestText = tree.readContent('/projects/bar/public/manifest.webmanifest');
+    const manifest = JSON.parse(manifestText);
+    for (const icon of manifest.icons) {
+      expect(icon.src).toMatch(/^icons\/icon-\d+x\d+.png/);
+    }
+  });
+
   it('should run the service worker schematic', async () => {
     const tree = await schematicRunner.runSchematic('ng-add', defaultOptions, appTree);
     const configText = tree.readContent('/angular.json');

packages/schematics/angular/application/index.ts

@@ -242,7 +242,7 @@ function addAppToWorkspaceFile(
           polyfills: ['zone.js'],
           tsConfig: `${projectRoot}tsconfig.app.json`,
           inlineStyleLanguage,
-          assets: [{ 'glob': '**/*', 'input': 'public' }],
+          assets: [{ 'glob': '**/*', 'input': `${projectRoot}public` }],
           styles: [`${sourceRoot}/styles.${options.style}`],
           scripts: [],
         },
@@ -282,7 +282,7 @@ function addAppToWorkspaceFile(
               polyfills: ['zone.js', 'zone.js/testing'],
               tsConfig: `${projectRoot}tsconfig.spec.json`,
               inlineStyleLanguage,
-              assets: [{ 'glob': '**/*', 'input': 'public' }],
+              assets: [{ 'glob': '**/*', 'input': `${projectRoot}public` }],
               styles: [`${sourceRoot}/styles.${options.style}`],
               scripts: [],
             },

packages/schematics/angular/application/index_spec.ts

@@ -277,7 +277,6 @@ describe('Application Schematic', () => {
 
     it('should set values in angular.json correctly', async () => {
       const options = { ...defaultOptions, projectRoot: '' };
-
       const tree = await schematicRunner.runSchematic('application', options, workspaceTree);
 
       const config = JSON.parse(tree.readContent('/angular.json'));
@@ -286,12 +285,14 @@ describe('Application Schematic', () => {
       const buildOpt = prj.architect.build.options;
       expect(buildOpt.index).toEqual('src/index.html');
       expect(buildOpt.browser).toEqual('src/main.ts');
+      expect(buildOpt.assets).toEqual([{ 'glob': '**/*', 'input': 'public' }]);
       expect(buildOpt.polyfills).toEqual(['zone.js']);
       expect(buildOpt.tsConfig).toEqual('tsconfig.app.json');
 
       const testOpt = prj.architect.test.options;
       expect(testOpt.tsConfig).toEqual('tsconfig.spec.json');
       expect(testOpt.karmaConfig).toBeUndefined();
+      expect(testOpt.assets).toEqual([{ 'glob': '**/*', 'input': 'public' }]);
       expect(testOpt.styles).toEqual(['src/styles.css']);
     });
 
@@ -377,6 +378,13 @@ describe('Application Schematic', () => {
       expect(buildOpt.browser).toEqual('foo/src/main.ts');
       expect(buildOpt.polyfills).toEqual(['zone.js']);
       expect(buildOpt.tsConfig).toEqual('foo/tsconfig.app.json');
+      expect(buildOpt.assets).toEqual([{ 'glob': '**/*', 'input': 'foo/public' }]);
+
+      const testOpt = project.architect.test.options;
+      expect(testOpt.tsConfig).toEqual('foo/tsconfig.spec.json');
+      expect(testOpt.karmaConfig).toBeUndefined();
+      expect(testOpt.assets).toEqual([{ 'glob': '**/*', 'input': 'foo/public' }]);
+      expect(testOpt.styles).toEqual(['foo/src/styles.css']);
 
       const appTsConfig = readJsonFile(tree, '/foo/tsconfig.app.json');
       expect(appTsConfig.extends).toEqual('../tsconfig.json');