Skip to content
New issue

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

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

Already on GitHub? Sign in to your account

Add .profvis-code scope to CSS #142

Merged
merged 9 commits into from
Sep 9, 2024
Merged

Add .profvis-code scope to CSS #142

merged 9 commits into from
Sep 9, 2024

Conversation

wch
Copy link
Member

@wch wch commented Apr 21, 2023

This makes it so that profvis will not affect other blocks of code, such as those from rmarkdown or Quarto.

Note: this still needs to be tested.

Fixes #140

@hadley
Copy link
Member

hadley commented Aug 22, 2024

This doesn't appear to work — now the code has no syntax highlighting. Probably because we also need to adjust the scope that highlight.js is applied to.

@hadley
Copy link
Member

hadley commented Aug 22, 2024

Looks like we need to update highlight.js and then call hljs.highlightElement(element) with the appropriate element.

@hadley
Copy link
Member

hadley commented Aug 22, 2024

Actually, we're already doing that:

      rows.append("td")
        .attr("class", "code r")
        .text(function(d) { return d.content; })
        .each(function() { hljs.highlightBlock(this); });

So it might be sufficient to update highlight.js?

@hadley
Copy link
Member

hadley commented Aug 22, 2024

This is definitely an improvement since we the styles are now better scoped, but it still appears to be re-styling other code blocks, and I can't figure out why.

@hadley
Copy link
Member

hadley commented Sep 9, 2024

Updating highlight to latest version to fixes the problem, since it no longer automatically highlights pre blocks across the whole page.

@hadley
Copy link
Member

hadley commented Sep 9, 2024

@wch do you mind double checking with this reprex?

---
format: html
---

```{r}
f <- function() {
  pause(0.1)
}
profvis::profvis(f())
```

```r
f <- function() {
  pause(0.1)
}
profvis::profvis(f())
```


@wch
Copy link
Member Author

wch commented Sep 9, 2024

This is with a slightly different version, with the code inside the profvis() call, so that we can see the code in the profvis panel as well.

---
format: html
---


```{r}
profvis::profvis({
  f <- function() {
    pause(0.1)
  }
  
  f()
})
```


```r
profvis::profvis({
  f <- function() {
    pause(0.1)
  }
  
  f()
})
```
image

@hadley
Copy link
Member

hadley commented Sep 9, 2024

Good idea. That all looks good to me.

@hadley hadley merged commit 1e12a0c into main Sep 9, 2024
11 checks passed
@hadley hadley deleted the css-scope branch September 9, 2024 18:22
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

profvis() messes up syntax highlighting in Quarto and R Markdown code blocks
2 participants