Accessibility : lighthouse script

package.json

@@ -48,7 +48,8 @@
     "build:storybook": "rm -Rf storybook-static && build-storybook -s ./public # TODO: we shouldn't need to remove, but Storybook 6.1 has a small bug and can't remove existing build automatically",
     "start:storybook-static": "serve storybook-static",
     "auto-changelog": "auto-changelog -u",
-    "build-storybook": "build-storybook"
+    "build-storybook": "build-storybook",
+    "audit": "cd scripts/lighthouse && node home-stats.js && xdg-open lhreport.html && cd ../../"
   },
   "dependencies": {
     "@apollo/client": "^3.2.0",

scripts/lighthouse/home-stats.js

@@ -1,10 +1,12 @@
+#! /usr/bin/node
+
 const fs = require('fs');
 const lighthouse = require('lighthouse');
 const chromeLauncher = require('chrome-launcher');
 
 /**
- * Script used to access statistics of your page.
- * Modify the url, run the script and see the result html file 'lhreport.html'.
+ * Script used to access statistics about your page.
+ * Modify the url and use "yarn run audit".
  * See https://github.com/GoogleChrome/lighthouse/blob/master/docs/readme.md#using-programmatically
  */
 (async () => {
@@ -24,11 +26,14 @@ const chromeLauncher = require('chrome-launcher');
 
   // `.lhr` is the Lighthouse Result as a JS object
   console.log('\nReport is done for', runnerResult.lhr.finalUrl);
-  console.log('Performance score was', runnerResult.lhr.categories.performance.score * 100);
-  console.log('Accessibility score was', runnerResult.lhr.categories.accessibility.score * 100);
-  console.log('Best Practices score was', runnerResult.lhr.categories['best-practices'].score * 100);
-  console.log('SEO score was', runnerResult.lhr.categories.seo.score * 100);
-  console.log('See the detailed results by opening the lhreport.html file\n');
-
+  if (!runnerResult.lhr.categories.performance.score && !runnerResult.lhr.categories.accessibility.score && !runnerResult.lhr.categories['best-practices'].score && !runnerResult.lhr.categories.seo.score) {
+    console.error("It seems that this page isn't reachable.\nIf you intent to audit a localhost page, be sure to run the app first.\n");
+  } else {
+    console.log('Performance score was', runnerResult.lhr.categories.performance.score * 100);
+    console.log('Accessibility score was', runnerResult.lhr.categories.accessibility.score * 100);
+    console.log('Best Practices score was', runnerResult.lhr.categories['best-practices'].score * 100);
+    console.log('SEO score was', runnerResult.lhr.categories.seo.score * 100);
+    console.log('See the detailed results again by opening the lhreport.html file in /scripts/lighthouse\n');
+  }
   await chrome.kill();
 })();

src/content/docs/features/testing.md

@@ -85,7 +85,7 @@ We use a plugin that will in turn rely on Next.js dotenv loading capabilities.
 Used for instance to load the default admin user credentials in tests.
 As a default, it will use development values from `.env.development`.
 
-## Lighthouse to test your pages
+## Lighthouse to audit your pages
 
 We use lighthouse to have statistics about our pages. See the main page example in scripts/lighthouse/home-stats.js.
-To run: run the app, open the folder with a terminal an execute 'node home-stats.js', then open the lhreport.html file
+To run: run the app and use "yarn run audit"

src/content/docs/release-process.md

@@ -53,6 +53,12 @@ yarn run storybook
 # Test storybook static build
 yarn run build:storybook && yarn run start:storybook-static # test storybook  static export
 
+# Optionnaly audit your page
+# Run the app
+# yarn run dev
+# While running, run the audit
+# yarn run audit
+
 # Optionnaly test Docker version (takes a lot of time + not very useful as they don't change often)
 # yarn run build:docker
 # yarn run build:test:docker