Skip to content

Bump vite from 5.1.7 to 5.3.1 #352

Bump vite from 5.1.7 to 5.3.1

Bump vite from 5.1.7 to 5.3.1 #352

Workflow file for this run

name: PR Helper
on:
pull_request:
types: [opened, synchronize, reopened]
permissions:
pull-requests: write
jobs:
screenshot:
runs-on: ubuntu-latest
name: Screenshot
steps:
- name: Checkout
uses: actions/checkout@v3
- name: Setup Node
uses: actions/setup-node@v3
with:
node-version-file: .node-version
registry-url: 'https://registry.npmjs.org'
- name: Setup pnpm
uses: pnpm/action-setup@v2
with:
run_install: false
- name: Get pnpm store directory
shell: bash
run: |
echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
- uses: actions/cache@v3
name: Setup pnpm cache
with:
path: ${{ env.STORE_PATH }}
key: ${{ runner.os }}-pnpm-store-${{ hashFiles('**/pnpm-lock.yaml') }}
restore-keys: |
${{ runner.os }}-pnpm-store-
- name: Install dependencies
run: pnpm install
- name: Take Screenshot
id: screenshot
env:
CLOUDFLARE_API_TOKEN: ${{ secrets.CLOUDFLARE_API_TOKEN }}
run: |
sha="$GITHUB_SHA"
git fetch origin
networks=$(
git diff --name-only origin/$GITHUB_BASE_REF \
| grep db/ \
| sed -E 's/db\/(.*)[.]json/\1/'
)
mkdir -p build
./cli build:visual
pnpm vite preview \
--host 0.0.0.0 \
--port 4173 \
--strictPort \
-c test/visual/vite.config.js \
-l silent \
"test/visual" \
&
pid="$!"
scale=2
pnpx playwright install
for network in $networks
do
pnpx playwright screenshot \
--viewport-size="$((850 * $scale)), $((400 * $scale))" \
"http://localhost:4173?network=$network&knobs=false&scale=$scale" \
"./build/$network.png"
done
pnpx playwright screenshot \
--full-page \
"http://localhost:4173?knobs=false&scale=$scale" \
"./build/index.png"
kill $pid
link_networks=""
for network in $networks
do
pnpm wrangler r2 object put \
-f ./build/$network.png \
react-social-icons/pr-images/$sha/$network.png
link_networks="$link_networks,https://static.react-social-icons.com/pr-images/$sha/$network.png"
done
pnpm wrangler r2 object put \
-f ./build/index.png \
react-social-icons/pr-images/$sha/index.png
link_index="https://static.react-social-icons.com/pr-images/$sha/index.png"
echo "link_networks=$link_networks" >> $GITHUB_OUTPUT
echo "link_index=$link_index" >> $GITHUB_OUTPUT
- name: Comment on PR with screenshots
uses: actions/github-script@v6
with:
script: |
const link_networks = '${{ steps.screenshot.outputs.link_networks }}'.split(',');
const link_index = '${{ steps.screenshot.outputs.link_index }}'
github.rest.pulls.createReview({
owner: context.repo.owner,
repo: context.repo.repo,
pull_number: context.payload.number,
event: 'COMMENT',
body: `
<h1>Screenshots</h1>
${link_networks
.filter(link => link.length > 0)
.sort((a, b) => a.localeCompare(b))
.map(link => {
const filename = link.replace(/^.*\//u, '')
const network = filename.replace('.png', '')
return `
<details>
<summary>
${network}
</summary>
<img
src="${link}"
alt="screenshot of an updated social network"
/>
</details>
`;
})
}
<details>
<summary>All Networks</summary>
<img
src="${link_index}"
alt="screenshot of all networks"
/>
</details>
`.replace(/^\s+/gm, '').trim()
})