feat: exclude desktop functionality from browser target (microsoft#713)

pjlittle · wbreza · commit ab3ce6f10832 · 2019-04-12T15:08:10.000-07:00
Remove electron functionality from browser builds. Some updates to
CI scripts, based on things found in the last release.
diff --git a/azure-pipelines/linux/artifact-build-linux.yml b/azure-pipelines/linux/artifact-build-linux.yml
@@ -8,13 +8,13 @@ steps:
     inputs:
       versionSpec: 10.x
 
-  - bash: |  
+  - bash: |
       set -ex
-      
+
       # clean install
       npm ci
-      npm run release
-      
+      npm run release-ci
+
       mkdir -p linux
       cp releases/vott*.snap linux/
     displayName: Build
diff --git a/azure-pipelines/mac/artifact-build-mac.yml b/azure-pipelines/mac/artifact-build-mac.yml
@@ -4,13 +4,13 @@ steps:
     inputs:
       versionSpec: 10.x
 
-  - bash: |  
+  - bash: |
       set -ex
-      
+
       # clean install
       npm ci
-      npm run release
-      
+      npm run release-ci
+
       mkdir -p mac
       cp releases/vott*.dmg mac/
     displayName: Build
diff --git a/azure-pipelines/windows/artifact-build-windows.yml b/azure-pipelines/windows/artifact-build-windows.yml
@@ -4,16 +4,16 @@ steps:
     inputs:
       versionSpec: 10.x
 
-  - bash: | 
+  - bash: |
       set -ex
-      
+
       # clean install
       npm ci
-      npm run release
-      
+      npm run release-ci
+
       mkdir -p windows
       cp releases/vott*.exe windows/
-      
+
     displayName: Build
 
   - task: PublishBuildArtifacts@1
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -65,6 +65,7 @@
         "eject": "react-scripts eject",
         "release-pr": "./scripts/release-pr.sh",
         "release-web": "npm run build && npm run webpack:prod",
+        "release-ci": "./scripts/build.sh",
         "release": "npm run build && npm run webpack:prod && electron-builder",
         "pretest": "./node_modules/.bin/tslint 'src/**/*.ts*'",
         "lintfix": "./node_modules/.bin/tslint 'src/**/*.ts*' --fix",
diff --git a/public/index.html b/public/index.html
@@ -19,14 +19,14 @@
       work correctly both with client-side routing and a non-root public URL.
       Learn how to configure a non-root public URL by running `npm run build`.
     -->
-    <title>Visual Object Tagging Tool (VoTT)</title>
+    <title>Visual Object Tagging Tool (VoTT) v%REACT_APP_VERSION%</title>
   </head>
   <body>
     <noscript>
       You need to enable JavaScript to run this app.
     </noscript>
     <div id="root"></div>
-    <div id="appInfo">VoTT v%REACT_APP_VERSION%, commit=%REACT_APP_COMMIT_SHA%</div>
+    <div style="display: none;">VoTT v%REACT_APP_VERSION%, commit=%REACT_APP_COMMIT_SHA%</div>
     <!--
       This HTML file is a template.
       If you open it directly in the browser, you will see an empty page.
diff --git a/scripts/build.sh b/scripts/build.sh
@@ -0,0 +1,18 @@
+#!/bin/bash
+set -euo pipefail
+
+# NOTE: this script should be ran from the root of the repository; the CWD should reflect this
+VERSION=$(node -pe "require('./package.json').version")
+COMMIT_SHA=$(git rev-parse --short HEAD)
+NPM_BIN_DIR=$(npm bin)
+
+echo "cwd=$(pwd)"
+echo "version=${VERSION}"
+echo "commit=${COMMIT_SHA}"
+
+export REACT_APP_VERSION=${VERSION}
+export REACT_APP_COMMIT_SHA=${COMMIT_SHA}
+
+npx react-scripts build
+npx webpack -p --config ./config/webpack.prod.js
+npx electron-builder
diff --git a/scripts/release-pr.sh b/scripts/release-pr.sh
@@ -49,7 +49,9 @@ then
     git tag -a ${NEW_VERSION} -m "VoTT v${NEW_VERSION}"
     # update package.json version and the changelog
     npm install json --no-save
+    # NOTE: at some point, we need to move to `npm version` and do all of this via build system
     ./node_modules/.bin/json -I -f package.json -4 -e "this.version=\"${NEW_VERSION}\""
+    ./node_modules/.bin/json -I -f package-lock.json -4 -e "this.version=\"${NEW_VERSION}\""
     ${BASEDIR}/generate-changelog.sh --from ${PREVIOUS_VERSION} --to ${NEW_VERSION}
     git commit -am "ci: update package version and changelog for ${NEW_VERSION} release"
     git push -u origin ${RELEASE_BRANCH}
diff --git a/src/index.scss b/src/index.scss
@@ -8,10 +8,6 @@ body {
     overflow: hidden;
 }
 
-#appInfo {
-    display: none;
-}
-
 input[type=file] {
     display: none;
 }
diff --git a/src/react/components/pages/appSettings/appSettingsPage.tsx b/src/react/components/pages/appSettings/appSettingsPage.tsx
@@ -9,6 +9,7 @@ import { AppSettingsForm } from "./appSettingsForm";
 import { RouteComponentProps } from "react-router-dom";
 import { toast } from "react-toastify";
 import { appInfo } from "../../../../common/appInfo";
+import { isElectron } from "../../../../common/hostProcess";
 
 /**
  * Props for App Settings Page
@@ -67,18 +68,22 @@ export default class AppSettingsPage extends React.Component<IAppSettingsProps>
                     <div className="my-3">
                         <p>{`${strings.appSettings.commit}: `} {process.env.REACT_APP_COMMIT_SHA}</p>
                     </div>
-                    <div className="my-3">
-                        <p>{strings.appSettings.devTools.description}</p>
-                        <button id="toggleDevTools" className="btn btn-primary btn-sm"
-                            onClick={this.toggleDevTools}>{strings.appSettings.devTools.button}
-                        </button>
-                    </div>
-                    <div className="my-3">
-                        <p>{strings.appSettings.reload.description}</p>
-                        <button id="refreshApp" className="btn btn-primary btn-sm"
-                            onClick={this.reloadApp}>{strings.appSettings.reload.button}
-                        </button>
-                    </div>
+                    { isElectron() &&
+                    <span>
+                        <div className="my-3">
+                            <p>{strings.appSettings.devTools.description}</p>
+                            <button id="toggleDevTools" className="btn btn-primary btn-sm"
+                                onClick={this.toggleDevTools}>{strings.appSettings.devTools.button}
+                            </button>
+                        </div>
+                        <div className="my-3">
+                            <p>{strings.appSettings.reload.description}</p>
+                            <button id="refreshApp" className="btn btn-primary btn-sm"
+                                onClick={this.reloadApp}>{strings.appSettings.reload.button}
+                            </button>
+                        </div>
+                    </span>
+                    }
                 </div>
             </div>
         );
diff --git a/src/react/components/pages/homepage/homePage.tsx b/src/react/components/pages/homepage/homePage.tsx
@@ -20,6 +20,7 @@ import ImportService from "../../../../services/importService";
 import { IAssetMetadata } from "../../../../models/applicationState";
 import { toast } from "react-toastify";
 import MessageBox from "../../common/messageBox/messageBox";
+import { isElectron } from "../../../../common/hostProcess";
 
 export interface IHomePageProps extends RouteComponentProps, React.Props<HomePage> {
     recentProjects: IProject[];
@@ -71,6 +72,7 @@ export default class HomePage extends React.Component<IHomePageProps, IHomePageS
                                 <h6>{strings.homePage.newProject}</h6>
                             </a>
                         </li>
+                        { isElectron() &&
                         <li>
                             <a href="#" onClick={() => this.filePicker.current.upload()} className="p-5 file-upload">
                                 <i className="fas fa-folder-open fa-9x"></i>
@@ -80,6 +82,7 @@ export default class HomePage extends React.Component<IHomePageProps, IHomePageS
                                 onChange={this.onProjectFileUpload}
                                 onError={this.onProjectFileUploadError} />
                         </li>
+                        }
                         <li>
                             {/*Open Cloud Project*/}
                             <a href="#" onClick={this.handleOpenCloudProjectClick} className="p-5 cloud-open-project">

Original file line number	Diff line number	Diff line change
`@@ -8,10 +8,6 @@ body {`
`8`	`8`	`overflow: hidden;`
`9`	`9`	`}`
`10`	`10`
`11`		`-#appInfo {`
`12`		`- display: none;`
`13`		`-}`
`14`		`-`
`15`	`11`	`input[type=file] {`
`16`	`12`	`display: none;`
`17`	`13`	`}`