build(aio): ensure that internal document links work with base href

aio/transforms/angular.io-package/index.js

@@ -49,6 +49,7 @@ module.exports =
         .processor(require('./processors/markBarredODocsAsPrivate'))
         .processor(require('./processors/filterPrivateDocs'))
         .processor(require('./processors/filterIgnoredDocs'))
+        .processor(require('./processors/fixInternalDocumentLinks'))
 
         // overrides base packageInfo and returns the one for the 'angular/angular' repo.
         .factory('packageInfo', function() { return require(path.resolve(PROJECT_ROOT, 'package.json')); })

aio/transforms/angular.io-package/processors/fixInternalDocumentLinks.js

@@ -0,0 +1,24 @@
+/**
+ * @dgProcessor fixInternalDocumentLinks
+ * @description
+ * Add in the document path to links that start with a hash.
+ * This is important when the web app has a base href in place,
+ * since links like: `<a href="#some-id">` would get mapped to
+ * the URL `base/#some-id` even if the current location is `base/some/doc`.
+ */
+module.exports = function fixInternalDocumentLinks() {
+
+  var INTERNAL_LINK = /(<a [^>]*href=")(#[^"]*)/gm;
+
+  return {
+    $runAfter: ['inlineTagProcessor'],
+    $runBefore: ['writeFilesProcessor'],
+    $process: function(docs) {
+      docs.forEach(doc => {
+        doc.renderedContent = doc.renderedContent.replace(INTERNAL_LINK, (_, pre, hash) => {
+          return pre + doc.path + hash;
+        });
+      });
+    }
+  };
+};

aio/transforms/angular.io-package/processors/fixInternalDocumentLinks.spec.js

@@ -0,0 +1,52 @@
+const testPackage = require('../../helpers/test-package');
+const processorFactory = require('./fixInternalDocumentLinks');
+const Dgeni = require('dgeni');
+
+describe('fixInternalDocumentLinks processor', () => {
+
+  it('should be available on the injector', () => {
+    const dgeni = new Dgeni([testPackage('angular.io-package')]);
+    const injector = dgeni.configureInjector();
+    const processor = injector.get('fixInternalDocumentLinks');
+    expect(processor.$process).toBeDefined();
+  });
+
+  it('should run before the correct processor', () => {
+    const processor = processorFactory();
+    expect(processor.$runBefore).toEqual(['writeFilesProcessor'])
+  });
+
+  it('should run before the correct processor', () => {
+    const processor = processorFactory();
+    expect(processor.$runAfter).toEqual(['inlineTagProcessor']);
+  });
+
+  it('should prefix internal hash links with the current doc path', () => {
+    const processor = processorFactory();
+    const docs = [
+      {
+        path: 'some/doc',
+        renderedContent: `
+          <a href="http://google.com#q=angular">Google</a>
+          <a href="some/relative/path#some-id">Some Id</a>
+          <a href="#some-internal-id">Link to heading</a>
+          <a class="important" href="#some-internal-id">Link to heading</a>
+          <a href="#some-internal-id" target="_blank">Link to heading</a>
+        `
+      },
+    ];
+    processor.$process(docs);
+    expect(docs).toEqual([
+      {
+        path: 'some/doc',
+        renderedContent: `
+          <a href="http://google.com#q=angular">Google</a>
+          <a href="some/relative/path#some-id">Some Id</a>
+          <a href="some/doc#some-internal-id">Link to heading</a>
+          <a class="important" href="some/doc#some-internal-id">Link to heading</a>
+          <a href="some/doc#some-internal-id" target="_blank">Link to heading</a>
+        `
+      },
+    ]);
+  })
+});