Error thrown running `storybook-to-ghpages` as a Github Action

[tysonnero]

I'm running the following npm script from a Github Action: "deploy-storybook": "storybook-to-ghpages -p packages -o=storybook-static --ci"

When npm run deploy-storybook is executed locally, it runs successfully.

When run as part of my Github Action, it fails with a generic error message. Running build-storybook from CI has no issue.

Step:

      - name: Deploy to GH Pages
        env:
          GH_TOKEN: ${{secrets.GITHUB_TOKEN}}
        run: npm run deploy-storybook

Error from Logs:

=> Deploying storybook
   executing: git push --force --quiet https://***@github.com/org/repo master:gh-pages
/home/runner/work/petra/petra/node_modules/@storybook/storybook-deployer/src/utils.js:14
  throw new Error(
  ^

Error: Exec code(128) on executing: git push --force --quiet https://***@github.com/org/repo master:gh-pages
undefined
    at Object.exec (/home/runner/work/petra/petra/node_modules/@storybook/storybook-deployer/src/utils.js:14:9)
    at Object.<anonymous> (/home/runner/work/petra/petra/node_modules/@storybook/storybook-deployer/bin/storybook_to_ghpages:69:14)
    at Module._compile (internal/modules/cjs/loader.js:955:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:991:10)
    at Module.load (internal/modules/cjs/loader.js:811:32)
    at Function.Module._load (internal/modules/cjs/loader.js:723:14)
    at Function.Module.runMain (internal/modules/cjs/loader.js:1043:10)
    at internal/main/run_main_module.js:17:11
npm ERR! code ELIFECYCLE
npm ERR! errno 1

[tysonnero]

Note: within the same workflow, I'm setting GH_TOKEN the same way and using it in another context, and that use case is working, so I'm not sure it could be an authentication issue on my end... unless I'm missing something.

[speed-e]

I am seeing the same issue. It works when publishing locally, but get the same error when trying to deploy from GitHub Actions. I have experimented with different permissions on Personal Access Token, but no luck.

[Bjodol]

I am seeing the same thing happening...

[Bjodol]

@tysonnero @speed-e Found a way to fix it! It seems the --ci option doesn't include github actors in the git url. Simply replace your token line with the the following. GH_TOKEN: MyCompany:${{ secrets.GITHUB_TOKEN }}.

Step example:

            - name: Deploy storybook to Github Pages
              run: npm run deploy-storybook -- --ci
              env:
                  GH_TOKEN: MyCompany:${{ secrets.GITHUB_TOKEN }}

[tysonnero]

@Bjodol Looks like that did the trick. Can you explain why this is need, and if a PR needs to be opened to fix any issue?

[Bjodol]

Of course @tysonnero! This is needed as the github api with token is in the following format: https://{actor}:{token}@github.com/{org}/{repo}. When you run it locally you do normal authentication which is valid against the api, however in --ci mode it uses the token api and then the format is invalid against private repos. Afaiu the actor is only needed for private repos.

This could be fixed here or in parse-repo package. I think a solid solution would be to have an optional GH_ACTOR in the options for this package so you always could override it.

[woozyking]

nvm seems that you cannot directly reference another environment variable when you set env through env: in github actions

~~this can be further improved through the provided GITHUB_ACTOR env var~~

- name: Deploy storybook to Github Pages
  run: npm run deploy-storybook -- --ci
  env:
    GH_TOKEN: ${{ github.actor }}:${{ secrets.GITHUB_TOKEN }}

updated working version based on comments below

[oanylund]

@woozyking try this instead: GH_TOKEN: ${{ github.actor }}:${{ secrets.GITHUB_TOKEN }}

[woozyking]

@oanylund this works, thank you! Just curious, where was this documented?

can we assume all those reserved GITHUB_xyz env vars can be referenced as ${{ github.xyz }}?

[oanylund]

No problem. Here: https://help.github.com/en/actions/reference/context-and-expression-syntax-for-github-actions

I think all default environment variables are in the context aswell. Here is the list of default env variables aswell: https://help.github.com/en/actions/configuring-and-managing-workflows/using-environment-variables

[michhyun1]

In my case, I have a private repo and even using GH_TOKEN: ${{ github.actor }}:${{ secrets.GITHUB_TOKEN }} did not work. It would correctly push to gh-pages branch, but it wouldn't trigger a deployment to github pages. I created a PAT on my own account and set it as a secret on the repo. Then I used that PAT secret instead of GITHUB_TOKEN and it was able to push to gh-pages and deploy the static changes to github pages.

[nperez0111]

I keep getting

Error: Exec code(128) on executing: git push --force --quiet https://github.com/agilemd/project-name master:gh-pages
fatal: could not read Username for 'https://github.com': No such device or address

With

      - name: Deploy to GitHub Pages
        run: npm run deploy -- --ci
        env:
          GH_TOKEN: ${{ github.actor }}:${{ secrets.GITHUB_TOKEN }}

[michhyun1]

I keep getting

Error: Exec code(128) on executing: git push --force --quiet https://github.com/agilemd/project-name master:gh-pages
fatal: could not read Username for 'https://github.com': No such device or address

With

      - name: Deploy to GitHub Pages
        run: npm run deploy -- --ci
        env:
          GH_TOKEN: ${{ github.actor }}:${{ secrets.GITHUB_TOKEN }}

Don't use the Github token, use a Personal Access Token

[nperez0111]

Actually it turns out that because of a build tool I was using (lerna) the --ci flag was not being passed into storybook-to-ghpages. You know storybook-to-ghpages should be smart enough to set itself to CI mode if the CI env variable is set (most CIs have that set to a truthy value). Would be a nice to have.