Add example to show how to disable shadow DOM

files/en-us/web/api/element/attachshadow/index.md

@@ -107,6 +107,8 @@ Returns a {{domxref("ShadowRoot")}} object.
 
 ## Examples
 
+### Word count custom element
+
 The following example is taken from our [word-count-web-component](https://github.com/mdn/web-components-examples/tree/main/word-count-web-component) demo ([see it live also](https://mdn.github.io/web-components-examples/word-count-web-component/)).
 You can see that we use `attachShadow()` in the middle of the code to create a shadow root, which we then attach our custom element's contents to.
 
@@ -152,6 +154,32 @@ class WordCount extends HTMLParagraphElement {
 customElements.define("word-count", WordCount, { extends: "p" });
 ```
 
+### Disabling shadow DOM
+
+If the element has a static property named `disabledFeatures`, which is an array containing the string `"shadow"`, then the `attachShadow()` call will throw an exception.
+
+For example:
+
+```js
+class MyCustomElement extends HTMLElement {
+  // Disable shadow DOM for this element.
+  static disabledFeatures = ["shadow"];
+
+  constructor() {
+    super();
+  }
+
+  connectedCallback() {
+    // Create a shadow root.
+    // This will throw an exception.
+    const shadow = this.attachShadow({ mode: "open" });
+  }
+}
+
+// Define the new element
+customElements.define("my-custom-element", MyCustomElement);
+```
+
 ## Specifications
 
 {{Specifications}}