Skip to content
This repository has been archived by the owner on Jul 3, 2024. It is now read-only.
/ expo-preview-action Public archive

With this preview action, you can test changes made in pull requests via Expo Go or custom development client (created with expo-dev-client) just by scanning QR code.

License

Notifications You must be signed in to change notification settings

expo/expo-preview-action

Use this GitHub action with your project
Add this Action to an existing workflow or create a new one
View on Marketplace

Repository files navigation

⚠️ DEPRECATION

This repository is considered deprecated. For the new version of this tool please go to expo-github-action.

expo preview action

This action allows you to automate expo build previews on pull requests to test your Expo app builds!

releases builds license

Usage   —   Examples   —   Changelog


📦 What's inside?

With this preview action, you can test changes made in pull requests via Expo Go or custom development client (created with expo-dev-client) just by scanning QR code.

🔧 Set up

This action requires expo-cli to be set up in your action environment. You can do it by yourself, but we encourage you to use expo-github-action to make this process as easy as possible.

Note: You need to be logged in to expo-cli (expo automatic login).

⚠️ If you're using a custom development client, your native project needs to contain configured expo-updates to be able to open published applications.

🏃‍♂️ How it works

This action will publish your project (to your configured channel) using expo-cli and produce output with the following variables:

  • EXPO_MANIFEST_URL - A URL pointing to the expo manifest of the published version.
  • EXPO_QR_CODE_URL - A URL pointing to the generated QR code which can be scanned using Expo Go or custom development client.
  • EXPO_PROJECT_URL - URL pointing to the expo project page with customizable QR code and deep link. This page lets you get the code/url for varying clients (expo go, or your expo development build). More on project pages here.
  • EXPO_NEW_BUILD_IS_REQUIRED - Whether a new build of your application is required to open generated preview.
  • EXPO_NEW_BUILD_IS_REQUIRED_MESSAGE - If a new build of your application is required to open generated preview, it will contain a default warning message.

You can use those variables to do whatever you want. For example, you can chain this action with unsplash/comment-on-pr to add a comment with QR code under pull request. See example workflows below.

⚙️ Configuration options

This action is customizable through variables - they are defined in the action.yml. Here is a summary of all the variables that you can use and their purpose.

variable required description
channel ✔️ The name of the update channel where your application will be published. Learn more.
project-flavor The type of the project. Available options: 'development-client' or 'expo-go'. Defaults to 'development-client'.
scheme The deep link scheme which will be used to open your project. This value isn't required, but we recommend setting it. Otherwise, action tries to guess the value. If you are using Expo Go to preview changes, this option is ignored.
project-root The path to the folder where package.json lives. Defaults to main directory of the repository.
expo-cli-path The path to the expo-cli. If you're using the expo-github-action or expo-cli was installed in the bin folder, you should ignore this option.
android-manifest-path The path to the AndroidManifest.xml. If scheme was provided or you're using the managed workflow, this option is ignored.
ios-info-plist-path The path to the Info.plist. If scheme was provided or you're using the managed workflow, this option is ignored.

📝 Example workflows

Before you dive into the workflow examples, you should know the basics of GitHub Actions. You can read more about this in the GitHub Actions documentation.

Create a QR code under pull request

Below you can see the example configuration to create a QR code on each pull request. The workflow listens to the pull_request event and sets up Node 14 using the Setup Node Action. It also auto-authenticates when the token is provided.

---
name: Create preview
on: [pull_request]
jobs:
  preview:
    name: Create preview
    runs-on: ubuntu-latest
    steps:
      - name: Set up repository
        uses: actions/checkout@v2
      - name: Set up Node
        uses: actions/setup-node@v1
        with:
          node-version: 14.x
      - name: Set up Expo
        uses: expo/expo-github-action@v7
        with:
          expo-version: latest
          token: ${{ secrets.EXPO_TOKEN }}
      - name: Install dependencies
        run: yarn install
      - name: Publish to Expo & create a QR code
        uses: expo/expo-preview-action@v1
        with:
          channel: pr-${{ github.event.number }}
        id: preview
      - name: Comment deployment link
        uses: unsplash/comment-on-pr@master
        env:
          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
        with:
          msg: >
            You can [preview the PR here](${{ steps.preview.outputs.EXPO_QR_CODE_URL }}).<br><br>
            <a href="${{ steps.publish.outputs.EXPO_QR_CODE_URL }}"><img src="${{ steps.preview.outputs.EXPO_QR_CODE_URL }}" height="512px" width="512px"></a>
            <br><br>
            QR code not working or need a different client? Try the QR code or deep link from the [project page](${{steps.preview.outputs.EXPO_PROJECT_URL}}).
            <br><br>
            ${{ steps.publish.outputs.EXPO_NEW_BUILD_IS_REQUIRED_MESSAGE }}

Create a preview only if app files were changed

Below you can see the example configuration to create a QR code on each pull request, but only if app files were changed. The workflow listens to the pull_request event and sets up Node 14 using the Setup Node Action. It also auto-authenticates when the token is provided.

---
name: Create preview
on:
  pull_request:
    paths:
      - 'package.json'
      - 'app.json'
      - '**/*.js'
      - '**/*.ts'
jobs:
  preview:
    name: Create preview
    runs-on: ubuntu-latest
    steps:
      - name: Set up repository
        uses: actions/checkout@v2
      - name: Set up Node
        uses: actions/setup-node@v1
        with:
          node-version: 14.x
      - name: Set up Expo
        uses: expo/expo-github-action@v7
        with:
          expo-version: latest
          token: ${{ secrets.EXPO_TOKEN }}
      - name: Install dependencies
        run: yarn install
      - name: Publish to Expo & create a QR code
        uses: expo/expo-preview-action@v1
        with:
          channel: pr-${{ github.event.number }}
        id: preview
      - name: Comment deployment link
        uses: unsplash/comment-on-pr@master
        env:
          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
        with:
          msg: >
            Awesome! You can [preview the PR here](${{ steps.preview.outputs.EXPO_QR_CODE_URL }}).<br><br>
            <a href="${{ steps.publish.outputs.EXPO_QR_CODE_URL }}"><img src="${{ steps.preview.outputs.EXPO_QR_CODE_URL }}" height="512px" width="512px"></a>
            <br><br>
            ${{ steps.publish.outputs.EXPO_NEW_BUILD_IS_REQUIRED_MESSAGE }}

About

With this preview action, you can test changes made in pull requests via Expo Go or custom development client (created with expo-dev-client) just by scanning QR code.

Topics

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages