chore(docs-app): add dynamic 404 behavior

Adapted from https://github.com/angular/angular/commit/88045a50506adfe32c2f7a213c8e95f46d1e40e1, https://github.com/angular/angular/commit/c3fb820473d64036ef0dd3d4c004cc7fbc67be75, and https://github.com/angular/angular/commit/5a624fa1be530a1b3479a4cc7f96e5a20a3d64fb.
2018-02-20 17:59:45 +01:00
parent 02fb980de6
commit a37f89f864
6 changed files with 136 additions and 10 deletions
@@ -9,6 +9,7 @@
  },

  "globals": {
+    "angular": false,
    /* testabilityPatch / matchers */
    "inject": false,
    "module": false,
@@ -21,6 +21,9 @@ describe('docs.angularjs.org', function() {
        console.log('browser console errors: ' + require('util').inspect(filteredLog));
      }
    });
+
+    browser.ignoreSynchronization = false;
+    browser.clearMockModules();
  });


@@ -102,6 +105,66 @@ describe('docs.angularjs.org', function() {
      expect(mainHeader.getText()).toEqual('Oops!');
    });

+    it('should set "noindex" if the page does not exist', function() {
+      browser.get('build/docs/index-production.html#!/api/does/not/exist');
+      var robots = element(by.css('meta[name="robots"][content="noindex"]'));
+      var googleBot = element(by.css('meta[name="googlebot"][content="noindex"]'));
+      expect(robots.isPresent()).toBe(true);
+      expect(googleBot.isPresent()).toBe(true);
+    });
+
+    it('should remove "noindex" if the page exists', function() {
+      browser.get('build/docs/index-production.html#!/api');
+      var robots = element(by.css('meta[name="robots"][content="noindex"]'));
+      var googleBot = element(by.css('meta[name="googlebot"][content="noindex"]'));
+      expect(robots.isPresent()).toBe(false);
+      expect(googleBot.isPresent()).toBe(false);
+    });
+
+    describe('template request error', function() {
+      beforeEach(function() {
+        browser.addMockModule('httpMocker', function() {
+          angular.module('httpMocker', ['ngMock'])
+            .run(['$httpBackend', function($httpBackend) {
+              $httpBackend.whenGET('localhost:8000/build/docs/partials/api.html').respond(500, '');
+            }]);
+          });
+      });
+
+      it('should set "noindex" for robots if the request fails', function() {
+        // index-test includes ngMock
+        browser.get('build/docs/index-test.html#!/api');
+        var robots = element(by.css('meta[name="robots"][content="noindex"]'));
+        var googleBot = element(by.css('meta[name="googlebot"][content="noindex"]'));
+        expect(robots.isPresent()).toBe(true);
+        expect(googleBot.isPresent()).toBe(true);
+      });
+    });
+
+
+    describe('page bootstrap error', function() {
+      beforeEach(function() {
+        browser.addMockModule('httpMocker', function() {
+          // Require a module that does not exist to break the bootstrapping
+          angular.module('httpMocker', ['doesNotExist']);
+        });
+    });
+
+      it('should have "noindex" for robots if bootstrapping fails', function() {
+        browser.get('build/docs/index.html#!/api').catch(function() {
+          // get() will fail on AngularJS bootstrap, but if we continue here, protractor
+          // will assume the app is ready
+          browser.ignoreSynchronization = true;
+          var robots = element(by.css('meta[name="robots"][content="noindex"]'));
+          var googleBot = element(by.css('meta[name="googlebot"][content="noindex"]'));
+          expect(robots.isPresent()).toBe(true);
+          expect(googleBot.isPresent()).toBe(true);
+        });
+      });
+
+
+    });
+
  });

 });
@@ -8,6 +8,8 @@ angular.module('DocsController', ['currentVersionData'])
  function($scope, $rootScope, $location, $window, $cookies,
              NG_PAGES, NG_NAVIGATION, CURRENT_NG_VERSION) {

+  var errorPartialPath = 'Error404.html';
+
  $scope.navClass = function(navItem) {
    return {
      active: navItem.href && this.currentPage && this.currentPage.path,
@@ -16,8 +18,6 @@ angular.module('DocsController', ['currentVersionData'])
    };
  };

-
-
  $scope.$on('$includeContentLoaded', function() {
    var pagePath = $scope.currentPage ? $scope.currentPage.path : $location.path();
    $window._gaq.push(['_trackPageview', pagePath]);
@@ -26,6 +26,7 @@ angular.module('DocsController', ['currentVersionData'])

  $scope.$on('$includeContentError', function() {
    $scope.loading = false;
+    $scope.loadingError = true;
  });

  $scope.$watch(function docsPathWatch() {return $location.path(); }, function docsPathWatchAction(path) {
@@ -35,6 +36,7 @@ angular.module('DocsController', ['currentVersionData'])
    var currentPage = $scope.currentPage = NG_PAGES[path];

    $scope.loading = true;
+    $scope.loadingError = false;

    if (currentPage) {
      $scope.partialPath = 'partials/' + path + '.html';
@@ -50,18 +52,22 @@ angular.module('DocsController', ['currentVersionData'])
    } else {
      $scope.currentArea = NG_NAVIGATION['api'];
      $scope.breadcrumb = [];
-      $scope.partialPath = 'Error404.html';
+      $scope.partialPath = errorPartialPath;
    }
  });

+  $scope.hasError = function() {
+    return $scope.partialPath === errorPartialPath || $scope.loadingError;
+  };
+
  /**********************************
   Initialize
   ***********************************/

  $scope.versionNumber = CURRENT_NG_VERSION.full;
  $scope.version = CURRENT_NG_VERSION.full + ' ' + CURRENT_NG_VERSION.codeName;
-  $scope.loading = 0;
-
+  $scope.loading = false;
+  $scope.loadingError = false;

  var INDEX_PATH = /^(\/|\/index[^.]*.html)$/;
  if (!$location.path() || INDEX_PATH.test($location.path())) {
@@ -22,6 +22,7 @@ module.exports = new Package('angularjs', [
 .factory(require('./services/deployments/debug'))
 .factory(require('./services/deployments/default'))
 .factory(require('./services/deployments/jquery'))
+.factory(require('./services/deployments/test'))
 .factory(require('./services/deployments/production'))

 .factory(require('./inline-tag-defs/type'))
@@ -157,12 +158,14 @@ module.exports = new Package('angularjs', [
  generateProtractorTestsProcessor,
  generateExamplesProcessor,
  debugDeployment, defaultDeployment,
-  jqueryDeployment, productionDeployment) {
+  jqueryDeployment, testDeployment,
+  productionDeployment) {

  generateIndexPagesProcessor.deployments = [
    debugDeployment,
    defaultDeployment,
    jqueryDeployment,
+    testDeployment,
    productionDeployment
  ];

@@ -0,0 +1,40 @@
+'use strict';
+
+module.exports = function testDeployment(getVersion) {
+  return {
+    name: 'test',
+    examples: {
+      commonFiles: {
+        scripts: ['../../../angular.js']
+      },
+      dependencyPath: '../../../'
+    },
+    scripts: [
+      '../angular.js',
+      '../angular-resource.js',
+      '../angular-route.js',
+      '../angular-cookies.js',
+      '../angular-mocks.js',
+      '../angular-sanitize.js',
+      '../angular-touch.js',
+      '../angular-animate.js',
+      'components/marked-' + getVersion('marked') + '/lib/marked.js',
+      'js/angular-bootstrap/dropdown-toggle.js',
+      'components/lunr-' + getVersion('lunr') + '/lunr.js',
+      'components/google-code-prettify-' + getVersion('google-code-prettify') + '/src/prettify.js',
+      'components/google-code-prettify-' + getVersion('google-code-prettify') + '/src/lang-css.js',
+      'js/current-version-data.js',
+      'js/all-versions-data.js',
+      'js/pages-data.js',
+      'js/nav-data.js',
+      'js/docs.js'
+    ],
+    stylesheets: [
+      'components/bootstrap-' + getVersion('bootstrap') + '/css/bootstrap.css',
+      'css/prettify-theme.css',
+      'css/angular-topnav.css',
+      'css/docs.css',
+      'css/animations.css'
+    ]
+  };
+};
@@ -11,6 +11,18 @@
  <meta name="fragment" content="!">
  <title ng-bind-template="AngularJS: {{ currentArea.name }}: {{ currentPage.name || 'Error: Page not found'}}">AngularJS</title>

+  <script type="text/javascript">
+    (function() {
+      // Dynamically, pre-emptively, add `noindex`, which will be removed when the doc is ready and valid
+      ['googlebot', 'robots'].forEach(function(bot) {
+        var tag = document.createElement('meta');
+        tag.name = bot;
+        tag.content = 'noindex';
+        tag.setAttribute('ng-if', 'hasError()');
+        document.head.appendChild(tag);
+      });
+    })();
+  </script>
  <script type="text/javascript">
    // dynamically add base tag as well as css and javascript files.
    // we can't add css/js the usual way, because some browsers (FF) eagerly prefetch resources
@@ -127,7 +139,7 @@
            </ul>

          </div>
-          <div class="search-results-container" ng-show="hasResults">
+          <div class="search-results-container" ng-show="hasResults" ng-cloak>
            <div class="container">
              <div class="search-results-frame">
                <div ng-repeat="(key, value) in results track by key" class="search-results-group" ng-class="colClassName + ' col-group-' + key" ng-show="value.length > 0">
@@ -157,7 +169,7 @@
          </div>
        </div>
      </nav>
-      <nav id="navbar-sub" class="sup-header navbar navbar-fixed-top" scroll-y-offset-element>
+      <nav id="navbar-sub" class="sup-header navbar navbar-fixed-top" scroll-y-offset-element ng-cloak>
        <div class="container main-grid main-header-grid">
          <div class="grid-left">
            <version-picker></version-picker>
@@ -174,7 +186,7 @@
      </nav>
    </header>

-    <section role="main" class="container main-body">
+    <section role="main" class="container main-body" ng-cloak>
      <div class="main-grid main-body-grid">
        <div class="grid-left">
          <a class="btn toc-toggle visible-xs" ng-click="toc=!toc">Show / Hide Table of Contents</a>
@@ -198,7 +210,8 @@
          </div>
        </div>
        <div class="grid-right">
-          <div id="loading" ng-show="loading">Loading...</div>
+          <div ng-show="loading">Loading &hellip;</div>
+          <div ng-show="loadingError">There was an error loading this resource. Please try again later.</div>
          <div ng-hide="loading" ng-include="partialPath" toc-collector autoscroll></div>
        </div>
      </div>