Skip to content
New issue

Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? # to your account

Quarto website not rendering custom theme from GitHub Action #95

Open
dfolio opened this issue Dec 19, 2023 · 6 comments
Open

Quarto website not rendering custom theme from GitHub Action #95

dfolio opened this issue Dec 19, 2023 · 6 comments
Assignees

Comments

@dfolio
Copy link

dfolio commented Dec 19, 2023

I have a Quarto website with a custom theme (i.e. custom.scss) hosted on Netlify.
Recently, I have a strange behavior when deploying with GitHub Action: my custom theme is no longer rendered! I checked the generated bootstrap.min.css and none of my customizations are there.
Everything works fine when rendering locally (i.e. quarto preview) or publishing directly (i.e. quarto publish) to Netlify: in both cases, my custom theme is properly generated and can be found in bootstrap.min.css .
Since publishing to Netlify from the shell command works fine (i.e. my custom theme can be found on my website), I don't think this is related to a Netlify caching issue, as reported on community.rstudio.

  • Example of local rendering or when published directly (i.e. quarto publish) to Netlify
    dfolio_good

  • Bad result using GitHub Action
    dfolio_bad

Below are the content of my _deploy.yml

on:
  workflow_dispatch:
  push:
    branches: main

name: Dfolio deploy

jobs:
  build-deploy:
    runs-on: ubuntu-latest
    steps:
      - name: Check out repository
        uses: actions/checkout@v4

      - name: Setup pandoc
        uses: r-lib/actions/setup-pandoc@v2

      - name: Setup R1
        uses: r-lib/actions/setup-r@v2
      - name: Setup R2
        uses: r-lib/actions/setup-r-dependencies@v2
        with:
          packages:
            any::knitr
            any::rmarkdown
          extra-packages:
            any::remotes
            any::RefManageR

      - name: Set up Quarto
        uses: quarto-dev/quarto-actions/setup@v2
        with:
          version: pre-release
          tinytex: true

      - name: Render Quarto Project
        uses: quarto-dev/quarto-actions/render@v2
        with:
          to: html

      - name: Publish to NETLIFY
        uses: quarto-dev/quarto-actions/publish@v2
        with:
          target: netlify
          NETLIFY_AUTH_TOKEN: ${{ secrets.NETLIFY_AUTH_TOKEN }}
@dragonstyle
Copy link

Could you share the project configuration and a sample QMD that is causing the issue? One common issue is specifying the theme on an individual page rather than globally in the project _quarto.yml file. This will sometimes work in preview as the individual page is rendered, but will not work when deployed as the complete site render will use the shared website CSS (as it should).

In Quarto 1.4 we did add a warning for this case to alert users to this situation...

@dfolio
Copy link
Author

dfolio commented Dec 20, 2023

Thank you for your prompt reply.
My website is quite heavy and is in a private repository on GitHub.
The theme is only specified in the _quarto.yml as follows:

format:
  html:
    minimal: true
    from: markdown+emoji
    date-modified: last-modified
    highlight: null
    mathjax: null
    html-math-method: plain
    theme:
      light: [scss/common.scss,scss/light.scss]
      dark: [scss/common.scss,scss/dark.scss]

Let me specify that the issue occurs on all pages.
I have also tested without any version: pre-release, and with version: 1.4.515 (my local version of Quarto).
All worked fine before (end of September), and this issue appears last week...

@dragonstyle
Copy link

OK well that should confirm it isn't related to per page themes - thanks for that.

It isn't a ton to go on (and the fact that it isn't working on any version of Quarto that you are trying making) without being able to troubleshoot specifically (especially since changing Quarto versions doesn't appear to resolve the issue). Some ideas to help troubleshoot:

  • What other variables have changed during that time period?
  • Are you able to diff the referenced CSS file to see what has changed (especially if you are able to render using identical versions on both CI and locally)?
  • If you remove your custom themes and instead just provide a simple custom theme that does something simple (e.g. places a border around the main tag, for example), does that appear to work in both places?

Sorry I don't have a quick answer but I'm not sure what could be causing this across Quarto versions. FWIW we use a custom theme on the quarto.org website which is built with every version of the pre-release so I think that generally custom themes appear to be working at least in that particular case...

@dragonstyle dragonstyle self-assigned this Dec 20, 2023
@dfolio
Copy link
Author

dfolio commented Dec 22, 2023

I did a quick history check.
The main change during this period was to update my website template to integrate (google) structured data.
Meanwhile, in the SCSS theme, a minor change was made to the dd/dl vertical spacing.

I will try your suggestions after the holidays.

@cderv
Copy link
Collaborator

cderv commented Dec 22, 2023

Can you share the netlify configuration in your github action ?

As this happens only from Action and this is not clear how quarto is involved, I wonder if this can come from the way quarto publish netlify it working.

We use an netlify JS client library but an old version as we deploy with it, and now deployment is integrated with the CLI.

Can you try the following to help see if this could be that

  • Configure your action to only render with Quarto
  • Configure publish step to either use netlify CLI directly, or one of the available Github action to deploy to netlify

We use this workflow for deploying our preview version (for PR) in Quarto web. See example at: https://github.com/quarto-dev/quarto-web/blob/main/.github/workflows/preview.yml

This is a long shot, as we use quarto publish netlify in Quarto web for our main website, and we don't have any issues. But still would be good to confirm you get the same.

Otherwise, if we can have access to your repo, this would help have a look to see if something stands out and we could investigate.

I feel that without a reproducible example to work with, it will be hard for us to investigate more

@dfolio
Copy link
Author

dfolio commented Jan 11, 2024

First, best whish for this new year!

I tried your suggestion by using " nwtgck/actions-netlify@v2" as the proposed example in preview.yml.
The deployed pages render properly with the correct SCSS theme! 👍

Here is the snippet for the deployment.

      - name: Deploy to Netlify
        id: netlify-deploy
        uses: nwtgck/actions-netlify@v2
        env:
          NETLIFY_SITE_ID: XXXXX-XXXXX-XXXXX-XXXXX-XXXX
          NETLIFY_AUTH_TOKEN: ${{ secrets.NETLIFY_AUTH_TOKEN }}
        with:
          publish-dir: './_site'
          production-deploy: true
          deploy-message: |
            Deploy from GHA

However, I am unsure why, but I have tested using quarto-dev/quarto-actions/publish@v2 and the deployed pages are rendering correctly !!! 😕
It is important to note that no major changes have been made on my side.
So, it seems difficult to conclude...

# for free to join this conversation on GitHub. Already have an account? # to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants