chore: update to docusaurus v3

[timdeschryver]

I wanted to see the impact of upgrading docusaurus, but everything seemed fined locally. This is a test to verify that our pipeline still works.

[netlify[bot]]

❌ Deploy Preview for testing-library failed.

Name	Link
🔨 Latest commit	9a82b3bb18bd96af25ed12d93f8159f2586750d6
🔍 Latest deploy log	https://app.netlify.com/sites/testing-library/deploys/6554885444e48700080a68a8

[MatanBobi]

Thanks Tim! AFAIR, the serious breaking change was upgrading to MDX v2, if our build passes I think we're good but maybe we can just verify it manually by running npx docusaurus-mdx-checker.

As far as I was able to see, there are also some visual changes, if you want I can have a look at those listed here: https://docusaurus.io/blog/preparing-your-site-for-docusaurus-v3

[timdeschryver]

You're right @MatanBobi I don't see any changes between our live version and this preview version.

[MatanBobi]

@timdeschryver i saw that they've released a new RC using MDX 3 today (or maybe that was yesterday?)

Are we waiting for the official release to merge this? I haven't had the time to review it yet so just wanted to know the urgency.

[timdeschryver]

It can wait @MatanBobi

[nickserv]

Thanks, I've updated to RC 1 (latest). Would it make sense to compare against the latest version of our template too?

[timdeschryver]

3.0.0 is released, I will update the PR later this week.

[nickserv]

I can help with updating the PR, but I'd like to block it on #1339 so we don't have to manually add pnpm to the docs.

[timdeschryver]

Thanks @MatanBobi , I'd like to wait on @nickmccurdy 's review

[nickserv]

Working on this a bit more by reviewing nitpicks and Docusaurus docs. Have we done any visual comparisons yet or should I try?

[MatanBobi]

Working on this a bit more by reviewing nitpicks and Docusaurus docs. Have we done any visual comparisons yet or should I try?

I made a quick browse (but haven't looked at all of the pages) and AFAIR, @timdeschryver also did.

[nickserv]

Great, thanks.

npx docusaurus-mdx-checker seems to be ok too, though the counts are off: https://github.com/slorber/docusaurus-mdx-checker/issues/1

[timdeschryver]

Working on this a bit more by reviewing nitpicks and Docusaurus docs. Have we done any visual comparisons yet or should I try?

@MatanBobi and myself have done some manual tests. I don't know if visual tests are worth the effort because we don't do anything special, we just use the default setup. That being said, ideally we have some tests so if you want please feel free and go ahead.

npx docusaurus-mdx-checker seems to be ok too, though the counts are off

AFAIK, we're not using MDX, just plain markdown. So this doesn't affect us too much. While upgrading another docs website I noticed we can also be explicit about this, and set the parser to markdown. https://docusaurus.io/docs/api/docusaurus-config#format

[nickserv]

Working on this a bit more by reviewing nitpicks and Docusaurus docs. Have we done any visual comparisons yet or should I try?

@MatanBobi and myself have done some manual tests. I don't know if visual tests are worth the effort because we don't do anything special, we just use the default setup. That being said, ideally we have some tests so if you want please feel free and go ahead.

We can use visual regression tests for this. However, it requires setting up additional infrastructure, so I'd prefer to investigate after. For now we should be fine, I forgot you both tested manually.

[MatanBobi]

AFAIK, we're not using MDX, just plain markdown. So this doesn't affect us too much. While upgrading another docs website I noticed we can also be explicit about this, and set the parser to markdown. https://docusaurus.io/docs/api/docusaurus-config#format

@timdeschryver I think we are using MDX features, I think this is an example, right?

[timdeschryver]

What's the status with this PR, do we need to take further actions?

[nickserv]

I'm still working on it, hopefully some more next week.

[denisx]

After updates, we can do this thing at root config ^_^

  headTags: [
    {
      tagName: 'link',
      attributes: {
        rel: 'preconnect',
        href: 'https://fonts.gstatic.com'
      },
    },
  ],