Generate playground previews for theme changes #42
Workflow file for this run
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| name: Preview Theme Changes | |
| on: | |
| pull_request: | |
| jobs: | |
| check-for-changes-to-themes: | |
| runs-on: ubuntu-latest | |
| steps: | |
| - name: Checkout | |
| uses: actions/checkout@v2 | |
| - name: Retrieved Theme Changes | |
| id: check-for-changes | |
| run: | | |
| # Retrieve list of all changed files | |
| git fetch origin trunk:trunk | |
| changed_files=$(git diff --name-only HEAD origin/trunk) | |
| # Loop through changed files and identify parent directories | |
| declare -A unique_dirs | |
| for file in $changed_files; do | |
| dir_name=$(dirname "$file") | |
| echo $dir_name | |
| if [[ -f "$dir_name/style.css" ]]; then # Check if the directory contains a theme | |
| # save only the basename | |
| unique_dirs[$dir_name]=$(basename $dir_name) | |
| echo $unique_dirs | |
| fi | |
| done | |
| # Check if themes have changed | |
| if [[ ${#unique_dirs[@]} -eq 0 ]]; then | |
| echo "No theme changes detected" | |
| echo "HAS_THEME_CHANGES=false" >> $GITHUB_OUTPUT | |
| exit 78 # Use neutral exit code | |
| fi | |
| # Output list of theme slugs with changes | |
| echo "HAS_THEME_CHANGES=true" >> $GITHUB_OUTPUT | |
| echo "CHANGED_THEMES=$(echo ${unique_dirs[@]})" >> $GITHUB_ENV | |
| echo "Theme directories with changes: $CHANGED_THEME_DIRS" | |
| - name: Comment on PR | |
| id: comment-on-pr | |
| if: ${{ steps.check-for-changes.outputs.HAS_THEME_CHANGES == 'true' }} | |
| uses: actions/github-script@v7 | |
| with: | |
| github-token: ${{ secrets.GITHUB_TOKEN }} | |
| script: | | |
| const fs = require('fs'); | |
| const createBlueprint = ( themeSlug, branch ) => { | |
| const template = { | |
| steps: [ | |
| { | |
| step: 'login', | |
| username: 'admin', | |
| password: 'password' | |
| }, | |
| { | |
| step: 'installTheme', | |
| themeZipFile: { | |
| resourece: 'url', | |
| url: `https://github-proxy.com/partial/Automattic/themes/${themeSlug}?branch=${branch}` | |
| } | |
| }, | |
| { | |
| step: 'activateTheme', | |
| themeFolderName: themeSlug | |
| } | |
| ] | |
| }; | |
| return JSON.stringify(template); | |
| }; | |
| const getThemeName = (themeSlug) => { | |
| const styleCss = fs.readFileSync(`${themeSlug}/style.css`, 'utf8'); | |
| const themeName = styleCss.match(/Theme Name:(.*)/i)[1].trim(); | |
| return themeName; | |
| }; | |
| const changedThemes = process.env.CHANGED_THEMES.split(' '); | |
| const previewLinks = changedThemes.map(themeSlug => { | |
| return `- [Preview changes for **${getThemeName(themeSlug)}**](https://playground.wordpress.net/#${createBlueprint(themeSlug, context.payload.pull_request.head.ref)})`; | |
| }).join('\n'); | |
| const comment = ` | |
| I've detected changes to the following themes: ${changedThemes.map(themeSlug => getThemeName(themeSlug)).join(', ')}.\n | |
| You can preview these changes by following the links below:\n | |
| ${previewLinks} | |
| I will update this comment with the latest preview links as you push more changes to this PR. | |
| The preview sites are created using [WordPress Playground](https://wordpress.org/playground/). You can add content, edit settings, and test the themes as you would on a real site, | |
| but please note that changes are not saved between sessions. | |
| `; | |
| // Check if a comment already exists | |
| const { data: comments } = await github.rest.issues.listComments({ | |
| issue_number: context.payload.pull_request.number, | |
| owner: context.repo.owner, | |
| repo: context.repo.repo | |
| }); | |
| const existingComment = comments.find(comment => comment.user.login === 'github-actions[bot]' && comment.body.startsWith('### Preview changes')); | |
| if (existingComment) { | |
| await github.rest.issues.updateComment({ | |
| comment_id: existingComment.id, | |
| owner: context.repo.owner, | |
| repo: context.repo.repo, | |
| body: `### Preview changes\n-\n${comment}` | |
| }); | |
| return; | |
| } | |
| github.rest.issues.createComment({ | |
| issue_number: context.payload.pull_request.number, | |
| owner: context.repo.owner, | |
| repo: context.repo.repo, | |
| body: `### Preview changes\n-\n${comment}` | |
| }); | |