Upload source maps to sentry (#810)

* Pretend to upload source maps to sentry

* Build release not in docker so we can upload source maps sensibly

and also upload the release as a plain tarball while we're at it

* fix yaml

* Try specifying version this way

* test rebuild

* pass secrets through

* Too many sentries

* It's almost 2023 and we're still having BSD vs GNU tar issues

* Maybe get sensible tag name & release identifier

* Wrong plugin, and also try the 'release' option which might the right thing

* Try a different github action

see if github likes that any better

* add contents write permission

and switch to the asset upload plugin that had the helpful doc

* actually put release name in tarball path

* copy docker config to right path

* Prettify vite config

* Only activate sentry plugin if we have secrets

* Use env var for tag name

* Also spelling env correctly would likely help

* Fix variable syntax

* Put env var in correct place

One day maybe I will not find yaml syntax confusing

.github/workflows/build.yaml

@@ -18,6 +18,11 @@ jobs:
         run: "yarn install"
       - name: Build
         run: "yarn run build"
+        env:
+          SENTRY_ORG: ${{ secrets.SENTRY_ORG }}
+          SENTRY_PROJECT: ${{ secrets.SENTRY_PROJECT }}
+          SENTRY_URL: ${{ secrets.SENTRY_URL }}
+          SENTRY_AUTH_TOKEN: ${{ secrets.SENTRY_AUTH_TOKEN }}
       - name: Upload Artifact
         uses: actions/upload-artifact@v2
         with:

.github/workflows/publish.yaml

@@ -13,7 +13,7 @@ jobs:
     name: Build & publish
     runs-on: ubuntu-latest
     permissions:
-      contents: read
+      contents: write # required to upload release asset
       packages: write
     steps:
       - name: Check it out
@@ -26,6 +26,33 @@ jobs:
           username: ${{ github.actor }}
           password: ${{ secrets.GITHUB_TOKEN }}
 
+      - name: Yarn cache
+        uses: actions/setup-node@v3
+        with:
+          cache: "yarn"
+      - name: Install dependencies
+        run: "yarn install"
+      - name: Build
+        run: "yarn run build"
+        env:
+          SENTRY_ORG: ${{ secrets.SENTRY_ORG }}
+          SENTRY_PROJECT: ${{ secrets.SENTRY_PROJECT }}
+          SENTRY_URL: ${{ secrets.SENTRY_URL }}
+          SENTRY_AUTH_TOKEN: ${{ secrets.SENTRY_AUTH_TOKEN }}
+          VITE_APP_VERSION: ${{ github.event.release.tag_name }}
+
+      - name: Create Tarball
+        env:
+          GITHUB_TAG_NAME: ${{ github.event.release.tag_name }}
+        run: |
+          tar --numeric-owner --transform "s/dist/element-call-${GITHUB_TAG_NAME}/" -cvzf element-call-${GITHUB_TAG_NAME}.tar.gz dist
+      - name: Upload
+        uses: alexellis/upload-assets@0.4.0
+        env:
+          GITHUB_TOKEN: ${{ github.token }}
+        with:
+          asset_paths: '["element-call-${{ github.event.release.tag_name }}.tar.gz"]'
+
       - name: Extract metadata (tags, labels) for Docker
         id: meta
         uses: docker/metadata-action@98669ae865ea3cffbcbaa878cf57c20bbf1c6c38

Dockerfile

@@ -1,15 +1,7 @@
-FROM --platform=$BUILDPLATFORM node:16-buster as builder
-
-WORKDIR /src
-
-COPY . /src
-RUN scripts/dockerbuild.sh
-
-# App
 FROM nginxinc/nginx-unprivileged:alpine
 
-COPY --from=builder /src/dist /app
+COPY ./dist /app
-COPY config/nginx.conf /etc/nginx/conf.d/
+COPY config/nginx.conf /etc/nginx/conf.d/default.conf
 
 USER root
 

package.json

@@ -66,6 +66,7 @@
   },
   "devDependencies": {
     "@babel/core": "^7.16.5",
+    "@sentry/vite-plugin": "^0.3.0",
     "@storybook/react": "^6.5.0-alpha.5",
     "@testing-library/jest-dom": "^5.16.5",
     "@testing-library/react": "^13.4.0",

vite.config.js

@@ -17,24 +17,42 @@ limitations under the License.
 import { defineConfig, loadEnv } from "vite";
 import svgrPlugin from "vite-plugin-svgr";
 import htmlTemplate from "vite-plugin-html-template";
+import sentryVitePlugin from "@sentry/vite-plugin";
+
 import path from "path";
 
 // https://vitejs.dev/config/
 export default defineConfig(({ mode }) => {
   const env = loadEnv(mode, process.cwd());
 
-  return {
+  const plugins = [
-    build: {
-      sourcemap: true,
-    },
-    plugins: [
     svgrPlugin(),
     htmlTemplate.default({
       data: {
         title: env.VITE_PRODUCT_NAME || "Element Call",
       },
     }),
-    ],
+  ];
+
+  if (
+    process.env.SENTRY_ORG &&
+    process.env.SENTRY_PROJECT &&
+    process.env.SENTRY_AUTH_TOKEN &&
+    process.env.SENTRY_URL
+  ) {
+    plugins.push(
+      sentryVitePlugin({
+        include: "./dist",
+        release: process.env.VITE_APP_VERSION,
+      })
+    );
+  }
+
+  return {
+    build: {
+      sourcemap: true,
+    },
+    plugins,
     resolve: {
       alias: {
         // matrix-widget-api has its transpiled lib/index.js as its entry point,