fix(web): support baseHref on serve (#3639)

ISSUES CLOSED: #3553

docs/angular/api-web/builders/dev-server.md

@@ -12,6 +12,14 @@ Type: `string`
 
 This option allows you to whitelist services that are allowed to access the dev server.
 
+### baseHref
+
+Default: `/`
+
+Type: `string`
+
+Base url for the application being built.
+
 ### buildTarget
 
 Type: `string`

docs/node/api-web/builders/dev-server.md

@@ -13,6 +13,14 @@ Type: `string`
 
 This option allows you to whitelist services that are allowed to access the dev server.
 
+### baseHref
+
+Default: `/`
+
+Type: `string`
+
+Base url for the application being built.
+
 ### buildTarget
 
 Type: `string`

docs/react/api-web/builders/dev-server.md

@@ -13,6 +13,14 @@ Type: `string`
 
 This option allows you to whitelist services that are allowed to access the dev server.
 
+### baseHref
+
+Default: `/`
+
+Type: `string`
+
+Base url for the application being built.
+
 ### buildTarget
 
 Type: `string`

packages/web/src/builders/dev-server/dev-server.impl.spec.ts

@@ -0,0 +1,48 @@
+import { MockBuilderContext } from '@nrwl/workspace/testing';
+import { getMockContext } from '../../utils/testing';
+import { EMPTY } from 'rxjs';
+import * as normalizeUtils from '../../utils/normalize';
+import { WebBuildBuilderOptions } from '../build/build.impl';
+import { run, WebDevServerOptions } from './dev-server.impl';
+
+jest.mock('@angular-devkit/build-webpack', () => ({
+  runWebpackDevServer: () => EMPTY,
+}));
+
+jest.mock('../../utils/devserver.config', () => ({
+  getDevServerConfig: jest.fn().mockReturnValue({}),
+}));
+
+describe('Web Server Builder', () => {
+  let context: MockBuilderContext;
+  let options: WebDevServerOptions;
+
+  beforeEach(async () => {
+    context = await getMockContext();
+    context.getProjectMetadata = jest
+      .fn()
+      .mockReturnValue({ sourceRoot: '/root/app/src' });
+
+    options = {
+      buildTarget: 'app:build',
+      port: 4200,
+    } as WebDevServerOptions;
+
+    jest
+      .spyOn(normalizeUtils, 'normalizeWebBuildOptions')
+      .mockReturnValue({} as WebBuildBuilderOptions);
+  });
+
+  it('should pass `baseHref` to build', async () => {
+    const baseHref = '/my-domain';
+    await run({ ...options, baseHref }, context).toPromise();
+
+    expect(normalizeUtils.normalizeWebBuildOptions).toHaveBeenCalledWith(
+      expect.objectContaining({
+        baseHref,
+      }),
+      '/root',
+      '/root/app/src'
+    );
+  });
+});

packages/web/src/builders/dev-server/dev-server.impl.ts

@@ -36,11 +36,12 @@ export interface WebDevServerOptions extends JsonObject {
   allowedHosts: string;
   maxWorkers?: number;
   memoryLimit?: number;
+  baseHref?: string;
 }
 
 export default createBuilder<WebDevServerOptions>(run);
 
-function run(
+export function run(
   serveOptions: WebDevServerOptions,
   context: BuilderContext
 ): Observable<DevServerBuildOutput> {
@@ -131,9 +132,9 @@ function getBuildOptions(
       context.getTargetOptions(target),
       context.getBuilderNameForTarget(target),
     ])
-      .then(([options, builderName]) =>
+      .then(([targetOptions, builderName]) =>
         context.validateOptions<WebBuildBuilderOptions & JsonObject>(
-          options,
+          { ...targetOptions, ...options },
           builderName
         )
       )

packages/web/src/builders/dev-server/schema.json

@@ -60,6 +60,11 @@
     "maxWorkers": {
       "type": "number",
       "description": "Number of workers to use for type checking."
+    },
+    "baseHref": {
+      "type": "string",
+      "description": "Base url for the application being built.",
+      "default": "/"
     }
   }
 }