Project Status Page (5.4 branch)

package.json

@@ -76,11 +76,13 @@
     "pretest": "gulp pretest",
     "start": "cd testapp && npm start",
     "test": "node scripts/test.js",
-    "website": "cd website && npm start",
-    "compile_to_es5": "gulp compile_to_es5"
+    "website": "cd website && npm start"
   },
   "license": "MIT",
   "engines": {
     "node": ">=10.13.x"
+  },
+  "volta": {
+    "node": "10.24.1"
   }
 }

tsconfig.json

@@ -1,6 +1,6 @@
 {
   "compilerOptions": {
-    "target": "es6",
+    "target": "es5",
     "module": "commonjs",
     "moduleResolution": "node",
     "sourceMap": true,

website/README.md

@@ -6,7 +6,8 @@ Generates the documentation for the protractor website.
 ## How to run
 
 ```shell
-npm run compile_to_es5
+npm i
+npm run build
 cd website/
 npm install
 npm run build
@@ -16,11 +17,30 @@ Then copy all the files from the `build` directory to the gh-pages branch.
 If you want to run the website locally then run the following command:
 
 ```shell
-npm start
+npm run website
 ```
 
 And point your browser to: [localhost:8080](http://localhost:8080/)
 
+
+### Build Failures on Apple Silicon / Arm64
+
+Some of the nested dependencies do not have compatible binaries for newer architectures. This generally presents as a fatal failure like the following: 
+```
+#
+# Fatal error in , line 0
+# Check failed: !value_obj->IsJSReceiver() || value_obj->IsTemplateInfo().
+#
+#
+#
+#FailureMessage Object: 0x306a626c0
+```
+
+Eventually the project should migrate to Gulp 5 / Node 18+ to solve this issue, but in the meantime a simple workaround is: 
+1. `cd website`
+2. `npm i && npm run arm64_repair`
+3. `npx gulp liveReload` (to avoid the `prestart` script)
+
 ## How to run the tests
 
 The website includes 3 types of tests:

website/css/protractor.less

@@ -12,6 +12,26 @@ a code {
   color: inherit;
 }
 
+
+.lts-alert {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-direction: column;
+  background: rgb(242, 253, 157);
+  box-shadow: 0 0 2px #999;
+  width: 100%;
+  margin: 50px auto 0 auto;
+  padding: 10px 0 0 0;
+}
+.lts-alert p{
+  max-width: 960px;
+  text-align: center;
+}
+
+.lh-1-5 { line-height: 1.5 }
+.mb-50 { margin-bottom: 50px }
+
 .protractor-container {
   margin-bottom: 50px;
   padding-top: @padding-top;

website/index.html

@@ -88,6 +88,19 @@
     </div>
   </div><!-- /.container-fluid -->
 </nav>
+<div class="lts-alert">
+  <p>
+    <span ng-show="isEOL">Protractor is deprecated and will reach end-of-life in August 2023. </span>
+    <span ng-hide="isEOL">Protractor reached end-of-life in August 2023.</span>
+
+    We discourage any new users from adopting Protractor and recommend existing users migrate to other end-to-end testing solutions. 
+
+    <a href="/#/project-status">See what ending support means</a> 
+    and 
+    <a href="https://blog.angular.io/the-state-of-end-to-end-testing-with-angular-d175f751cb9c" target="_blank">read the end of life announcement</a> 
+    for more information.
+  </p>
+</div>
 <div class="container protractor-container" ng-view autoscroll="true"></div>
 <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
 <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.7/angular.min.js"></script>

website/js/modules.js

@@ -1,3 +1,8 @@
 'use strict';
 
-angular.module('protractorApp', ['ngRoute']);
+angular.module('protractorApp', ['ngRoute'])
+  .run(['$rootScope', function($rootScope){
+    const now = new Date().getTime()
+    $rootScope.isEOL = (now >= new Date('2023-09-01T00:00:00'));
+    $rootScope.isEOCS = (now >= new Date('2024-09-01T00:00:00'));
+  }]);

website/js/routes.js

@@ -9,6 +9,10 @@ angular.module('protractorApp').config(function($routeProvider) {
         controller: 'ApiCtrl',
         reloadOnSearch: false
       }).
+      when('/project-status', {
+        templateUrl: 'partials/status.html',
+        controller: 'MarkdownCtrl'
+      }).
       when('/style-guide', {
         templateUrl: 'partials/style-guide.html',
         controller: 'MarkdownCtrl'