tables not rendering properly with V2 Webpack loader

[souporserious]

Subject of the issue

Tables do not render properly in V2 using the following markup:

| Tables        |      Are      |   Cool |
| ------------- | :-----------: | -----: |
| col 3 is      | right-aligned | \$1600 |
| col 2 is      |   centered    |   \$12 |
| zebra stripes |   are neat    |    \$1 |

I tested this in the latest V1 which is working as expected.

Your environment

• OS: macOS Catalina: 10.15.7
• Packages: @mdx-js/loader: 2.0.0-next.9 and @mdx-js/react: 2.0.0-next.9
• Env: Node: v14.16.1 and NextJS: 10.2.3

Steps to reproduce

Install the latest V2 release

{
  "@mdx-js/loader": "2.0.0-next.9",
  "@mdx-js/react": "2.0.0-next.9"
}

See this reproduction in a minimal NextJS app with the latest MDX V2 loader.

Expected behaviour

Should render a table with respective HTML tags.

Actual behaviour

Renders table markdown as a string in a p tag.

[ChristianMurphy]

@souporserious could you provide a codesandbox with an example of the issue?
Testing with mdx runtime https://codesandbox.io/s/jolly-firefly-hpnli?file=/src/App.js this works fine.
It sounds like it may be an issue with Next rather than MDX.

[souporserious]

@ChristianMurphy thanks for taking a look! I made a minimal reproduction here. Yeah, weird it's working in runtime fine 🤔 I wasn't sure if it is Next or Webpack related.

[ChristianMurphy]

Interesting, it may be loader related https://codesandbox.io/s/practical-williamson-52hhz?file=/src/index.js 🤔
There are a few fixes which are stalled in mdx, which have been applied in xdm, it may help to try https://github.com/wooorm/xdm#next as well?

[souporserious]

Yeah, thinking it's loader related. I tested out xdm to see if that would help, but it has the same issue for some reason. I'll dig in further and see if I can find anything, appreciate your help!