Test that the example check is working

camptocamp · Feb 14, 2020 · de78c81 · de78c81
1 parent b554372
commit de78c81
Show file tree

Hide file tree

Showing 89 changed files with 139 additions and 19 deletions.
diff --git a/.github/workflows/ci.yaml b/.github/workflows/ci.yaml
@@ -30,7 +30,7 @@ jobs:
       - run: npm --version
 
       - run: sudo apt update
-      - run: sudo apt install g++-4.8 python3-venv
+      - run: sudo apt install g++-4.8 python3-venv graphicsmagick fonts-liberation2
 
       - uses: actions/checkout@v1
       - run: git config --global user.name "Continuous integration"
@@ -46,13 +46,22 @@ jobs:
       # Webpack build of ngeo/gmf examples and gmf apps
       - run: NODE_ENV=production make examples-hosted
       - run: make check-examples
+      - uses: actions/upload-artifact@v1
+        with:
+          name: Examples hosted
+          path: .build/examples-hosted
+        if: failure()
+
       #- run: npm run typecheck
       - run: "! (npm run typecheck|grep -v '^node_modules/'|grep '^[a-z]')"
       # Generate API doc
       - run: npm run doc
       - run: npm run jsdoc
       - run: npm run build-api
-      - run: cat /home/runner/.npm/_logs/*
+      - uses: actions/upload-artifact@v1
+        with:
+          name: Npm logs
+          path: /home/runner/.npm/_logs
         if: failure()
 
       - uses: camptocamp/initialise-gopass-summon-action@v1

diff --git a/Makefile b/Makefile
@@ -290,35 +290,51 @@ contribs/dist: .build/build-dll.timestamp
 		.build/node_modules.timestamp \
 		.build/httpserver.timestamp
 	mkdir -p $(dir $@)
-	node buildtools/check-example.js .build/examples-hosted/$*.html
+	CI=true LANGUAGE=en_US node buildtools/check-example.js \
+		.build/examples-hosted/$*.html
 	[ "$$(gm compare -metric RMSE -highlight-style xor .build/examples-hosted/$*.html.png \
-	examples/$*-ref.png -file .build/examples-hosted/$*.html.png-diff.png 2>&1 | \
-	tail --lines=1 | sed 's/.* \([0-9\.]\+\) .*/\1/g')" \< 0.005 ]
+		examples/$*-ref.png -file .build/examples-hosted/$*.html.png-diff.png 2>&1 | \
+		tail --lines=1 | sed 's/.* \([0-9\.]\+\) .*/\1/g')" \< 0.005 ]
+	touch $@
+
+.build/error.check.timestamp: .build/examples-ngeo.timestamp \
+		.build/node_modules.timestamp \
+		.build/httpserver.timestamp
+	mkdir -p $(dir $@)
+	CI=true LANGUAGE=en_US node buildtools/check-example.js \
+		.build/examples-hosted/error.html
+	gm compare -metric RMSE -highlight-style xor .build/examples-hosted/error.html.png \
+		examples/error-ref.png -file .build/examples-hosted/error.html.png-diff.png
+	[ "$$(gm compare -metric RMSE -highlight-style xor .build/examples-hosted/error.html.png \
+		examples/error-ref.png -file .build/examples-hosted/error.html.png-diff.png 2>&1 | \
+		tail --lines=1 | sed 's/.* \([0-9\.]\+\) .*/\1/g')" \> 0.005 ]
 	touch $@
 
 .build/contribs/gmf/%.check.timestamp: .build/examples-gmf.timestamp \
 		.build/node_modules.timestamp \
 		.build/httpserver.timestamp
 	mkdir -p $(dir $@)
-	node buildtools/check-example.js .build/examples-hosted/contribs/gmf/$*.html
+	CI=true LANGUAGE=en_US node buildtools/check-example.js \
+		.build/examples-hosted/contribs/gmf/$*.html
 	[ "$$(gm compare -metric RMSE -highlight-style xor .build/examples-hosted/contribs/gmf/$*.html.png \
-	contribs/gmf/examples/$*-ref.png -file .build/examples-hosted/contribs/gmf/$*-diff.png 2>&1 | \
-	tail --lines=1 | sed 's/.* \([0-9\.]\+\) .*/\1/g')" \< 0.005 ]
+		contribs/gmf/examples/$*-ref.png -file .build/examples-hosted/contribs/gmf/$*-diff.png 2>&1 | \
+		tail --lines=1 | sed 's/.* \([0-9\.]\+\) .*/\1/g')" \< 0.005 ]
 	touch $@
 
 .build/contribs/gmf/apps/%.check.timestamp: .build/gmf-apps.timestamp \
 		.build/httpserver.timestamp
 	mkdir -p $(dir $@)
-	node buildtools/check-example.js .build/examples-hosted/contribs/gmf/apps/$*.html
+	CI=true LANGUAGE=en_US node buildtools/check-example.js \
+		.build/examples-hosted/contribs/gmf/apps/$*.html
 	[ "$$(gm compare -metric RMSE -highlight-style xor .build/examples-hosted/contribs/gmf/apps/$*.html.png \
-	contribs/gmf/apps/$*-ref.png -file .build/examples-hosted/contribs/gmf/apps/$*-diff.png 2>&1 | \
-	tail --lines=1 | sed 's/.* \([0-9\.]\+\) .*/\1/g')" \< 0.005 ]
+		contribs/gmf/apps/$*-ref.png -file .build/examples-hosted/contribs/gmf/apps/$*-diff.png 2>&1 | \
+		tail --lines=1 | sed 's/.* \([0-9\.]\+\) .*/\1/g')" \< 0.005 ]
 	touch $@
 
 .build/test-check-example/%.check.timestamp: \
 		.build/httpserver.timestamp test/check-example/%.html
 	mkdir -p $(dir $@)
-	( ! node buildtools/check-example.js test/check-example/$*.html)
+	( ! CI=true LANGUAGE=en_US node buildtools/check-example.js test/check-example/$*.html)
 	touch $@
 
 .build/node_modules.timestamp: package.json

diff --git a/buildtools/check-example.js b/buildtools/check-example.js
@@ -79,11 +79,15 @@ function loaded(page, browser) {
         await browser.close();
       }
     }
-  }, 2000);
+  }, 1000);
 }
 (async () => {
-  browser = await puppeteer.launch({args: ['--no-sandbox', '--disable-web-security', '--single-process']});
+  browser = await puppeteer.launch({
+    args: ['--no-sandbox', '--disable-web-security', '--single-process'],
+    headless: true
+  });
   const page = await browser.newPage();
+
   await page.setViewport({width: 1920, height: 1080});
   await page.setRequestInterception(true);
   page.on('pageerror', async e => {
@@ -132,7 +136,11 @@ function loaded(page, browser) {
         request.headers().origin = 'http://localhost:3000';
       }
       request.continue({
-        url
+        url,
+        // Don't be intranet
+        headers: {
+          'Forwarded': 'for=8.8.8.8;proto=https'
+        }
       });
     } else if (url.includes('tile.openstreetmap.org') ||
         url.startsWith('https://tiles.openseamap.org') ||

diff --git a/contribs/gmf/apps/desktop-ref.png b/contribs/gmf/apps/desktop-ref.png
diff --git a/contribs/gmf/apps/desktop/Controller.js b/contribs/gmf/apps/desktop/Controller.js
@@ -54,6 +54,7 @@ class Controller extends AbstractDesktopController {
   /**
    * @param {angular.IScope} $scope Scope.
    * @param {angular.auto.IInjectorService} $injector Main injector.
+   * @ngInject
    */
   constructor($scope, $injector) {
     super({

diff --git a/contribs/gmf/apps/desktop_alt-ref.png b/contribs/gmf/apps/desktop_alt-ref.png
diff --git a/contribs/gmf/apps/iframe_api-ref.png b/contribs/gmf/apps/iframe_api-ref.png
diff --git a/contribs/gmf/apps/mobile-ref.png b/contribs/gmf/apps/mobile-ref.png
diff --git a/contribs/gmf/apps/mobile_alt-ref.png b/contribs/gmf/apps/mobile_alt-ref.png
diff --git a/contribs/gmf/apps/oeedit-ref.png b/contribs/gmf/apps/oeedit-ref.png
diff --git a/contribs/gmf/examples/authentication-ref.png b/contribs/gmf/examples/authentication-ref.png
diff --git a/contribs/gmf/examples/backgroundlayerselector-ref.png b/contribs/gmf/examples/backgroundlayerselector-ref.png
diff --git a/contribs/gmf/examples/contextualdata-ref.png b/contribs/gmf/examples/contextualdata-ref.png
diff --git a/contribs/gmf/examples/datepicker-ref.png b/contribs/gmf/examples/datepicker-ref.png
diff --git a/contribs/gmf/examples/displayquerygrid-ref.png b/contribs/gmf/examples/displayquerygrid-ref.png
diff --git a/contribs/gmf/examples/displayquerywindow-ref.png b/contribs/gmf/examples/displayquerywindow-ref.png
diff --git a/contribs/gmf/examples/drawfeature-ref.png b/contribs/gmf/examples/drawfeature-ref.png
diff --git a/contribs/gmf/examples/editfeature-ref.png b/contribs/gmf/examples/editfeature-ref.png
diff --git a/contribs/gmf/examples/editfeatureselector-ref.png b/contribs/gmf/examples/editfeatureselector-ref.png
diff --git a/contribs/gmf/examples/elevation-ref.png b/contribs/gmf/examples/elevation-ref.png
diff --git a/contribs/gmf/examples/featurestyle-ref.png b/contribs/gmf/examples/featurestyle-ref.png
diff --git a/contribs/gmf/examples/filterselector-ref.png b/contribs/gmf/examples/filterselector-ref.png
diff --git a/contribs/gmf/examples/importdatasource-ref.png b/contribs/gmf/examples/importdatasource-ref.png
diff --git a/contribs/gmf/examples/layertree-ref.png b/contribs/gmf/examples/layertree-ref.png
diff --git a/contribs/gmf/examples/layertreeadd-ref.png b/contribs/gmf/examples/layertreeadd-ref.png
diff --git a/contribs/gmf/examples/lidarprofile-ref.png b/contribs/gmf/examples/lidarprofile-ref.png
diff --git a/contribs/gmf/examples/lidarprofile.css b/contribs/gmf/examples/lidarprofile.css
@@ -1,6 +1,6 @@
 gmf-map > div {
-  width: 80rem;
-  height: 40rem;
+  width: 60rem;
+  height: 30rem;
 }
 #gmf-lidarprofile-container {
   position: relative;

diff --git a/contribs/gmf/examples/mobilemeasure-ref.png b/contribs/gmf/examples/mobilemeasure-ref.png
diff --git a/contribs/gmf/examples/mouseposition-ref.png b/contribs/gmf/examples/mouseposition-ref.png
diff --git a/contribs/gmf/examples/objectediting-ref.png b/contribs/gmf/examples/objectediting-ref.png
diff --git a/contribs/gmf/examples/objecteditinghub-ref.png b/contribs/gmf/examples/objecteditinghub-ref.png
diff --git a/contribs/gmf/examples/permalink-ref.png b/contribs/gmf/examples/permalink-ref.png
diff --git a/contribs/gmf/examples/print-ref.png b/contribs/gmf/examples/print-ref.png
diff --git a/contribs/gmf/examples/profile-ref.png b/contribs/gmf/examples/profile-ref.png
diff --git a/contribs/gmf/examples/profile.css b/contribs/gmf/examples/profile.css
@@ -1,6 +1,6 @@
 gmf-map > div {
-  width: 80rem;
-  height: 40rem;
+  width: 60rem;
+  height: 30rem;
 }
 .gmf-profile-container {
   display: flex;

diff --git a/contribs/gmf/examples/search-ref.png b/contribs/gmf/examples/search-ref.png
diff --git a/contribs/gmf/examples/share-ref.png b/contribs/gmf/examples/share-ref.png
diff --git a/contribs/gmf/examples/simple-ref.png b/contribs/gmf/examples/simple-ref.png
diff --git a/contribs/gmf/examples/themeselector-ref.png b/contribs/gmf/examples/themeselector-ref.png
diff --git a/contribs/gmf/examples/timeslider-ref.png b/contribs/gmf/examples/timeslider-ref.png
diff --git a/contribs/gmf/examples/wfspermalink-ref.png b/contribs/gmf/examples/wfspermalink-ref.png
diff --git a/contribs/gmf/examples/xsdattributes-ref.png b/contribs/gmf/examples/xsdattributes-ref.png
diff --git a/examples/animation-ref.png b/examples/animation-ref.png
diff --git a/examples/asitvd-ref.png b/examples/asitvd-ref.png
diff --git a/examples/attributes-ref.png b/examples/attributes-ref.png
diff --git a/examples/backgroundlayer-ref.png b/examples/backgroundlayer-ref.png
diff --git a/examples/backgroundlayerdropdown-ref.png b/examples/backgroundlayerdropdown-ref.png
diff --git a/examples/colorpicker-ref.png b/examples/colorpicker-ref.png
diff --git a/examples/control-ref.png b/examples/control-ref.png
diff --git a/examples/createfeature-ref.png b/examples/createfeature-ref.png
diff --git a/examples/datepicker-ref.png b/examples/datepicker-ref.png
diff --git a/examples/datetimepicker-ref.png b/examples/datetimepicker-ref.png
diff --git a/examples/disclaimer-ref.png b/examples/disclaimer-ref.png
diff --git a/examples/displaywindow-ref.png b/examples/displaywindow-ref.png
diff --git a/examples/drawfeature-ref.png b/examples/drawfeature-ref.png
diff --git a/examples/elevationProfile-ref.png b/examples/elevationProfile-ref.png
diff --git a/examples/error-ref.png b/examples/error-ref.png
diff --git a/examples/error.css b/examples/error.css
@@ -0,0 +1,5 @@
+
+#map {
+  width: 600px;
+  height: 400px;
+}
diff --git a/examples/error.html b/examples/error.html
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html ng-app='app'>
+  <head>
+    <title>Simple example</title>
+    <meta charset="utf-8">
+    <meta name="viewport"
+          content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <meta name="mobile-web-app-capable" content="yes">
+  </head>
+  <body ng-controller="MainController as ctrl">
+    <div id="map" ngeo-map="ctrl.map"></div>
+    <p id="desc">This example shows how to use the <code><a href="../apidoc/ngeo.map.component.html" title="Read our documentation">ngeo-map</a></code> component to insert an OpenLayers map in a page.</p>
+    <script type="text/javascript" src="dist/vendor.js"></script>
+  </body>
+</html>
diff --git a/examples/error.js b/examples/error.js
@@ -0,0 +1,66 @@
+// The MIT License (MIT)
+//
+// Copyright (c) 2014-2020 Camptocamp SA
+//
+// Permission is hereby granted, free of charge, to any person obtaining a copy of
+// this software and associated documentation files (the "Software"), to deal in
+// the Software without restriction, including without limitation the rights to
+// use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
+// the Software, and to permit persons to whom the Software is furnished to do so,
+// subject to the following conditions:
+//
+// The above copyright notice and this permission notice shall be included in all
+// copies or substantial portions of the Software.
+//
+// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
+// FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
+// COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
+// IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
+// CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+
+
+import './simple.css';
+import angular from 'angular';
+import olMap from 'ol/Map.js';
+
+import olView from 'ol/View.js';
+import olLayerTile from 'ol/layer/Tile.js';
+import olSourceOSM from 'ol/source/OSM.js';
+import ngeoMapModule from 'ngeo/map/module.js';
+
+
+/** @type {angular.IModule} **/
+const module = angular.module('app', [
+  'gettext',
+  ngeoMapModule.name
+]);
+
+
+/**
+ * @constructor
+ * @ngInject
+ */
+function MainController() {
+
+  /**
+   * @type {import("ol/Map.js").default}
+   */
+  this.map = new olMap({
+    layers: [
+      new olLayerTile({
+        source: new olSourceOSM()
+      })
+    ],
+    view: new olView({
+      center: [0, 0],
+      zoom: 4
+    })
+  });
+}
+
+
+module.controller('MainController', MainController);
+
+
+export default module;
diff --git a/examples/googlestreetview-ref.png b/examples/googlestreetview-ref.png
diff --git a/examples/grid-ref.png b/examples/grid-ref.png
diff --git a/examples/importfeatures-ref.png b/examples/importfeatures-ref.png
diff --git a/examples/interactionbtngroup-ref.png b/examples/interactionbtngroup-ref.png
diff --git a/examples/layerorder-ref.png b/examples/layerorder-ref.png
diff --git a/examples/layertree-ref.png b/examples/layertree-ref.png
diff --git a/examples/locationsearch-ref.png b/examples/locationsearch-ref.png
diff --git a/examples/mapfishprint-ref.png b/examples/mapfishprint-ref.png
diff --git a/examples/mapswipe-ref.png b/examples/mapswipe-ref.png
diff --git a/examples/measure-ref.png b/examples/measure-ref.png
diff --git a/examples/mobilegeolocation-ref.png b/examples/mobilegeolocation-ref.png
diff --git a/examples/modal-ref.png b/examples/modal-ref.png
diff --git a/examples/modifycircle-ref.png b/examples/modifycircle-ref.png
diff --git a/examples/modifyrectangle-ref.png b/examples/modifyrectangle-ref.png
diff --git a/examples/notification-ref.png b/examples/notification-ref.png
diff --git a/examples/offline-ref.png b/examples/offline-ref.png
diff --git a/examples/permalink-ref.png b/examples/permalink-ref.png
diff --git a/examples/popover-ref.png b/examples/popover-ref.png
diff --git a/examples/popupservice-ref.png b/examples/popupservice-ref.png
diff --git a/examples/query-ref.png b/examples/query-ref.png
diff --git a/examples/recenter-ref.png b/examples/recenter-ref.png
diff --git a/examples/rotate-ref.png b/examples/rotate-ref.png
diff --git a/examples/routing-ref.png b/examples/routing-ref.png
diff --git a/examples/scaleselector-ref.png b/examples/scaleselector-ref.png
diff --git a/examples/search-ref.png b/examples/search-ref.png
diff --git a/examples/simple-ref.png b/examples/simple-ref.png
diff --git a/examples/simple3d-ref.png b/examples/simple3d-ref.png
diff --git a/examples/svg-ref.png b/examples/svg-ref.png
diff --git a/examples/toolActivate-ref.png b/examples/toolActivate-ref.png