fix(v2): @theme/heading should not create anchor if id is not defined (#1925)

CHANGELOG-2.x.md

@@ -20,6 +20,7 @@ function Home() {
 ([#1860](https://github.com/facebook/Docusaurus/issues/1860))
 
 ### Bug Fixes
+- Fix MDX `@theme/Heading` component. If there is no id, it should not create anchor link.
 - Fixed a bug in which if `themeConfig.algolia` is not defined, the custom searchbar won't appear.
 If you've swizzled Algolia `SearchBar` component before, please update your source code otherwise CSS might break. See [#1909](https://github.com/facebook/docusaurus/pull/1909/files) for reference.
 ```js

packages/docusaurus-theme-classic/src/theme/Heading/index.js

@@ -11,14 +11,19 @@ import React from 'react';
 
 import './styles.css';
 
-const Heading = Tag => ({id, ...props}) => (
-  <Tag {...props}>
-    <a aria-hidden="true" className="anchor" id={id} />
-    <a aria-hidden="true" className="hash-link" href={`#${id}`}>
-      #
-    </a>
-    {props.children}
-  </Tag>
-);
+const Heading = Tag => ({id, ...props}) => {
+  if (!id) {
+    return <Tag {...props} />;
+  }
+  return (
+    <Tag {...props}>
+      <a aria-hidden="true" className="anchor" id={id} />
+      <a aria-hidden="true" className="hash-link" href={`#${id}`}>
+        #
+      </a>
+      {props.children}
+    </Tag>
+  );
+};
 
 export default Heading;