ci: test gcp demo site build (#805)

* ci: test docs-publish

* Require unit tests for dry run

* ci: Make sure our docs publish is executable

* Try to correct path issue

* Try repo prefix

* Try as yarn command

* Need a workspace to attach to from previous step

* Add before we call our bash script

* See if we can enforce commands being available -- or just install locally?

* Try again

* Try SSH

* Include username in gh https url

* Note regarding failure on PR branches

* Remove docs publish from PR workflow

* chore: ability to specify an alternative html-template at build time

* chore: add command to build demo PWA website output

* chore: remove unused CI code

* Testing GCP capabilities

* syntax

* Naming

* naming

.circleci/build-and-publish-docs.sh

@@ -12,16 +12,6 @@ yarn global bin
 yarn config get prefix
 yarn config set prefix ~/.yarn
 export PATH="$PATH:`yarn global bin`"
-# yarn global add gitbook-cli
-# yarn global add gh-pages
-# npm i gitbook-cli -g
-# npm i gh-pages -g
-# yarn list
-
-# export PATH="$(yarn global bin):$PATH"
-
-which gitbook
-which gh-pages
 
 echo 'Running Gitbook installation'
 
@@ -68,12 +58,7 @@ done
 cd ..
 
 echo "Done generating documentation output"
-echo 'PUBLISHING'
+echo 'STARTING PUBLISH'
-
-# git config --global user.email "danny.ri.brown+ohif-bot@gmail.com"
-# git config --global user.name "ohif-bot"
-# git config user.email "danny.ri.brown+ohif-bot@gmail.com"
-# git config user.name "ohif-bot"
 
 # WILL ALWAYS FAIL IF INITIATED FROM PR BRANCH
 ./node_modules/.bin/gh-pages \

.circleci/config.yml

@@ -191,9 +191,6 @@ jobs:
       - run: yarn global add gh-pages
       - run: chmod +x ~/repo/.circleci/build-and-publish-docs.sh
       - run: ~/repo/.circleci/build-and-publish-docs.sh
-      # - run:
-      #     name: Generate & Publish Docs
-      #     command: yarn run docs:publish
 
   docker_publish:
     <<: *defaults
@@ -224,7 +221,7 @@ jobs:
               docker push ohif/$IMAGE_NAME:latest
             fi
 
-  deploy_demo_site:
+  viewer_demo_build:
     <<: *defaults
     steps:
       - attach_workspace:
@@ -233,21 +230,21 @@ jobs:
       - run:
           name: 'Build Demo Site, Upload SourceMaps, Send Deploy Notification'
           command: |
-            yarn build:demo:ci
+            npx lerna run build:viewer:demo --stream
-            perl -i -pe 's#</head>#`cat .circleci/rollbar.html` #e' build/index.html
+            # perl -i -pe 's#</head>#`cat .circleci/rollbar.html` #e' build/index.html
-            export FILE_1=$(find ./build/static/js -type f -name "2.*.js" -exec basename {} \;)
+            # export FILE_1=$(find ./build/static/js -type f -name "2.*.js" -exec basename {} \;)
-            export FILE_MAIN=$(find ./build/static/js -type f -name "main.*.js" -exec basename {} \;)
+            # export FILE_MAIN=$(find ./build/static/js -type f -name "main.*.js" -exec basename {} \;)
-            export FILE_RUNTIME_MAIN=$(find ./build/static/js -type f -name "runtime~main.*.js" -exec basename {} \;)
+            # export FILE_RUNTIME_MAIN=$(find ./build/static/js -type f -name "runtime~main.*.js" -exec basename {} \;)
-            curl https://api.rollbar.com/api/1/sourcemap -F source_map=@build/static/js/$FILE_1.map -F access_token=$ROLLBAR_TOKEN -F version=$CIRCLE_SHA1 -F minified_url=https://$GOOGLE_STORAGE_BUCKET/static/js/$FILE_1
+            # curl https://api.rollbar.com/api/1/sourcemap -F source_map=@build/static/js/$FILE_1.map -F access_token=$ROLLBAR_TOKEN -F version=$CIRCLE_SHA1 -F minified_url=https://$GOOGLE_STORAGE_BUCKET/static/js/$FILE_1
-            curl https://api.rollbar.com/api/1/sourcemap -F source_map=@build/static/js/$FILE_MAIN.map -F access_token=$ROLLBAR_TOKEN -F version=$CIRCLE_SHA1 -F minified_url=https://$GOOGLE_STORAGE_BUCKET/static/js/$FILE_MAIN
+            # curl https://api.rollbar.com/api/1/sourcemap -F source_map=@build/static/js/$FILE_MAIN.map -F access_token=$ROLLBAR_TOKEN -F version=$CIRCLE_SHA1 -F minified_url=https://$GOOGLE_STORAGE_BUCKET/static/js/$FILE_MAIN
-            curl https://api.rollbar.com/api/1/sourcemap -F source_map=@build/static/js/$FILE_RUNTIME_MAIN.map -F access_token=$ROLLBAR_TOKEN -F version=$CIRCLE_SHA1 -F minified_url=https://$GOOGLE_STORAGE_BUCKET/static/js/$FILE_RUNTIME_MAIN
+            # curl https://api.rollbar.com/api/1/sourcemap -F source_map=@build/static/js/$FILE_RUNTIME_MAIN.map -F access_token=$ROLLBAR_TOKEN -F version=$CIRCLE_SHA1 -F minified_url=https://$GOOGLE_STORAGE_BUCKET/static/js/$FILE_RUNTIME_MAIN
             curl --request POST https://api.rollbar.com/api/1/deploy/ -F access_token=$ROLLBAR_TOKEN -F environment=$GOOGLE_STORAGE_BUCKET -F revision=$CIRCLE_SHA1 -F local_username=CircleCI
       # Persist :+1:
       - persist_to_workspace:
           root: ~/repo
           paths: .
 
-  demo_site_publish:
+  viewer_demo_publish:
     working_directory: ~/repo
     docker:
       - image: google/cloud-sdk
@@ -257,20 +254,18 @@ jobs:
       - setup_remote_docker:
           docker_layer_caching: true
       - run:
-          name: Deploy latest version to viewer.ohif.org
+          name: Node Test
-          command: |
+          command: npx lerna run build:viewer:demo --stream
-            # This file will exist if a new version was published by
+      # - run:
-            # our `semantic-release` command in the previous job
+      #     name: Deploy latest version to viewer.ohif.org
-            #if [[ ! -e tmp/updated-version.txt ]]; then
+      #     command: |
-            #  exit 0
+      #       # https://circleci.com/docs/2.0/google-auth/#authorization
-            #else
+      #       echo $GCLOUD_SERVICE_KEY | gcloud auth activate-service-account --key-file=-
-              echo $GCLOUD_SERVICE_KEY | gcloud auth activate-service-account --key-file=-
+      #       gcloud --quiet config set project ${GOOGLE_PROJECT_ID}
-              gcloud --quiet config set project ${GOOGLE_PROJECT_ID}
+      #       gcloud --quiet config set compute/zone ${GOOGLE_COMPUTE_ZONE}
-              gcloud --quiet config set compute/zone ${GOOGLE_COMPUTE_ZONE}
+      #       # Remove all files in Storage Bucket; Push latest
-
+      #       gsutil -m rm gs://$GOOGLE_STORAGE_BUCKET/**
-              gsutil -m rm gs://$GOOGLE_STORAGE_BUCKET/**
+      #       gsutil -m rsync -R platform/viewer/dist gs://$GOOGLE_STORAGE_BUCKET
-              gsutil -m rsync -R build gs://$GOOGLE_STORAGE_BUCKET
-            #fi
 
 workflows:
   version: 2
@@ -338,9 +333,9 @@ workflows:
       #     requires:
       #       - npm_publish
       # Update viewer.ohif.org
-      # - build_demo_site:
+      - viewer_demo_build:
-      #     requires:
+          requires:
-      #       - cypress/run
+            - cypress/run
-      # - demo_site_publish:
+      - viewer_demo_publish:
-      #     requires:
+          requires:
-      #       - build_demo_site
+            - viewer_demo_build

platform/viewer/.webpack/pwa.prod.js

@@ -13,6 +13,7 @@ const SRC_DIR = path.join(__dirname, '../src');
 const DIST_DIR = path.join(__dirname, '../dist');
 const PUBLIC_DIR = path.join(__dirname, '../public');
 // Env Vars
+const HTML_TEMPLATE = process.env.HTML_TEMPLATE || 'index.html';
 const PUBLIC_URL = process.env.PUBLIC_URL || '';
 const APP_CONFIG = process.env.APP_CONFIG || 'config/default.js';
 
@@ -56,7 +57,7 @@ module.exports = (env, argv) => {
           to: DIST_DIR,
           toType: 'dir',
           // Ignore our HtmlWebpackPlugin template file
-          ignore: ['index.html', '.DS_Store'],
+          ignore: ['index.html', 'html-templates/*', '.DS_Store'],
         },
       ]),
       new ExtractCssChunksPlugin({
@@ -69,7 +70,7 @@ module.exports = (env, argv) => {
        * This is the easiest way to inject custom configuration and extensions.
        */
       new HtmlWebpackPlugin({
-        template: `${PUBLIC_DIR}/index.html`,
+        template: `${PUBLIC_DIR}/html-templates/${HTML_TEMPLATE}`,
         filename: 'index.html',
         templateParameters: {
           PUBLIC_URL: PUBLIC_URL,

platform/viewer/package.json

@@ -20,6 +20,7 @@
     "build:package": "webpack --config .webpack/commonjs.prod.js",
     "build:viewer": "webpack --config .webpack/pwa.prod.js",
     "build:viewer:ci": "cross-env PUBLIC_URL=/pwa APP_CONFIG=config/netlify.js webpack --config .webpack/pwa.prod.js",
+    "build:viewer:demo": "cross-env PUBLIC_URL=/ APP_CONFIG=config/demo.js HTML_TEMPLATE=rollbar.html webpack --config .webpack/pwa.prod.js",
     "build:viewer:package": "yarn run build:package",
     "dev": "webpack-dev-server --config .webpack/all.dev.js -w",
     "dev:orthanc": "cross-env APP_CONFIG=config/docker_nginx-orthanc.js react-scripts start",

platform/viewer/public/html-templates/index.html

@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <meta
+      name="viewport"
+      content="width=device-width, initial-scale=1, shrink-to-fit=no"
+    />
+    <meta name="theme-color" content="#000000" />
+
+    <link rel="manifest" href="<%= PUBLIC_URL %>/manifest.json" />
+    <script
+      type="text/javascript"
+      src="<%= PUBLIC_URL %>/<%= APP_CONFIG %>"
+    ></script>
+
+    <title>OHIF Viewer</title>
+
+    <!-- WEB FONTS -->
+    <link
+      href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700|Sanchez&display=swap"
+      rel="stylesheet"
+    />
+
+    <!-- EXTENSIONS -->
+    <!-- <script type="text/javascript" src="path/to/some-extension.js"></script>
+
+    <script>
+      window.config.extensions = [SomeExtension];
+    </script> -->
+  </head>
+
+  <body>
+    <noscript> You need to enable JavaScript to run this app. </noscript>
+
+    <div id="root"></div>
+  </body>
+</html>