feat(ci): Test and Publish in CI (#42)

Author: garbas

.github/workflows/ci.yml

@@ -6,6 +6,9 @@ on:
     branches:
       - "main"
   pull_request:
+  release:
+    types:
+      - published
 
 concurrency:
   group: "ci-${{ github.ref_name }}-${{ github.event_name }}-${{ github.event.number || (github.event.pull_request.head.sha || github.sha) }}"
@@ -17,10 +20,20 @@ env:
 jobs:
 
   build:
-    name: "Build"
-    runs-on: "ubuntu-latest"
+    name: "Build on ${{ matrix.os }}"
+    runs-on: ${{ matrix.os }}
+
     timeout-minutes: 30
 
+    strategy:
+      matrix:
+        os:
+          - "ubuntu-latest"
+          - "macos-latest"
+
+    outputs:
+      vsixPath: ${{ steps.package.outputs.vsixPath }}
+
     steps:
       - name: "Checkout"
         uses: "actions/checkout@v4"
@@ -54,14 +67,73 @@ jobs:
         with:
           command: "npm run compile"
 
+      - name: "Test on MacOS"
+        if: ${{ matrix.os == 'macos-latest' }}
+        run: |
+          npm run test
+
+      - name: "Test on Linux"
+        if: ${{ matrix.os == 'ubuntu-latest' }}
+        run: |
+          xvfb-run -a npm test
+
       - name: "Package"
+        id: "package"
         uses: "flox/activate-action@main"
         with:
-          command: "npm run package -- --out flox-main.vsix"
+          command: "npm run package -- --out flox-latest.vsix"
 
       - name: "Upload vscode extention as artifact"
         uses: "actions/upload-artifact@v4"
         with:
-          name: "flox-main.vsix"
-          path: "flox-main.vsix"
+          name: "flox-latest-${{ matrix.os }}.vsix"
+          path: "flox-latest.vsix"
           retention-days: 14
+
+  publish:
+    name: "Publish VSCode "
+
+    if: ${{ github.event_name == 'release' }}
+    needs:
+      - "build"
+
+    runs-on: ubuntu-latest
+    timeout-minutes: 10
+
+    steps:
+
+      - name: "Checkout"
+        uses: "actions/checkout@v4"
+        with:
+          fetch-depth: 0
+
+      - name: "Install Flox"
+        uses: "flox/install-flox-action@main"
+
+      - name: "Restore npm cache"
+        uses: "actions/cache@v4"
+        with:
+          path: |
+            ~/.npm
+          key: "${{ runner.os }}-npm-${{ hashFiles('**/package-lock.json') }}-${{ hashFiles('**/*.js', '**/*.jsx', '**/*.ts', '**/*.tsx') }}"
+          restore-keys: |
+            ${{ runner.os }}-npm-${{ hashFiles('**/package-lock.json') }}-
+
+      - name: "Install"
+        uses: "flox/activate-action@main"
+        with:
+          command: "npm ci"
+
+      - name: "Download Build Artifact"
+        uses: actions/download-artifact@v4
+        with:
+          name: "flox-latest-ubuntu-latest.vsix"
+
+      - name: "Publish to Visual Studio Marketplace"
+        uses: "flox/activate-action@main"
+        with:
+          command: |
+            vsce publish \
+              --pat "${{ secrets.MANAGED_VSCODE_MARKETPLACE_TOKEN }}" \
+              --allow-star-activation \
+              --pre-release

.vscodeignore

@@ -11,6 +11,8 @@ vsc-extension-quickstart.md
 **/*.map
 **/*.ts
 **/.vscode-test.*
+scripts/**
 !scripts/reopen.sh
+assets/**
 !assets/icon.png
 !assets/icon.svg

README.md

@@ -1,45 +1,23 @@
-<h1 align="center">
-  <a href="https://flox.dev" target="_blank">
-    <picture>
-      <source media="(prefers-color-scheme: dark)"  srcset="assets/flox-logo-white-on-black.png" />
-      <source media="(prefers-color-scheme: light)" srcset="assets/flox-logo-black-on-white.png" />
-      <img src="assets//flox-logo-black-on-white.png" alt="flox logo" />
-    </picture>
-  </a>
-</h1>
-
-<h2 align="center">
-  Developer environments you can take with you
-</h2>
-
-<h3 align="center">
-   &emsp;
-   <a href="https://discourse.flox.dev"><b>Discourse</b></a>
-   &emsp; | &emsp; 
-   <a href="https://flox.dev/docs"><b>Documentation</b></a>
-   &emsp; | &emsp; 
-   <a href="https://flox.dev/blog"><b>Blog</b></a>
-   &emsp; | &emsp;  
-   <a href="https://twitter.com/floxdevelopment"><b>Twitter</b></a>
-   &emsp; | &emsp; 
-   <a href="https://go.flox.dev/slack"><b>Slack</b></a>
-   &emsp;
-</h3>
-
-[Flox][website] is a virtual environment and package manager all in one. With
-Flox you create environments that layer and replace dependencies just where it
-matters, making them portable across the full software lifecycle.
-
-`flox-vscode` is a VSCode editor extension that integrates Flox environments
-with VSCode.
-
-<!-- TODO: List features (with screenshots) -->
-
-## 🤝 Found a bug? Missing a specific feature?
-
-Feel free to [file a new issue][new-issue] with a respective title and
-description on the `flox/flox-vscode` repository. If you already found a
-solution to your problem, we would love to review your pull request!
+# Bring Flox to VSCode
+
+<img src="./assets/icon.png" align="right" width="128" height="128">
+
+[Flox](https://flox.dev) is a virtual environment and package manager all in
+one. With Flox you create environments that layer and replace dependencies just
+where it matters, making them portable across the full software lifecycle.
+
+`flox-vscode` is a VSCode extension that integrates Flox environments with
+VSCode.
+
+* 📖 Flox documentation can be found [here](https://flox.dev/docs).
+* 🚀 Get in touch: [Slack](https://go.flox.dev/slack), [Discourse](https://discourse.flox.dev)
+* 🤝 Found a bug? Missing a specific feature? Feel free to [file a new issue][new-issue].
+
+[new-issue]: https://github.com/flox/flox-vscode/issues/new/choose
+
+<p align="center">
+  <img src="./assets/demo.gif" width="100%" />
+</p>
 
 ## ⭐️ Contribute
 
@@ -49,7 +27,3 @@ guide](./CONTRIBUTING.md) first.
 ## 🪪 License
 
 The Flox CLI is licensed under the GPLv2. See [LICENSE](./LICENSE).
-
-
-[website]: https://flox.dev
-[new-issue]: https://github.com/flox/flox-vscode/issues/new/choose