@samitouri / QOS-React / commits / e0b802fc4e

Fixes example in Web Components docs (#11039)

* fixes docs on webcomponent * Update web-components.md

Dominic Gannaway committed Oct 4, 2017 at 17:12 UTC e0b802fc4e8e7bd91a6b94e1c2bbbf0f3966ad86
1 file changed +7 -1
docs/docs/web-components.md
+7 -1
@@ -41,8 +41,10 @@ function BrickFlipbox() {
41
42 ## Using React in your Web Components
43
44 +Similarly, you can call `ReactDOM.render()` from inside a web component:
45 +
46 ```javascript
45 -class XSearch {
47 +class XSearch extends HTMLElement {
48 connectedCallback() {
49 const mountPoint = document.createElement('span');
50 this.attachShadow({ mode: 'open' }).appendChild(mountPoint);
@@ -54,3 +56,7 @@ class XSearch {
56 }
57 customElements.define('x-search', XSearch);
58 ```
59 +
60 +>Note:
61 +>
62 +>This code will **not** work if compiled with Babel [due to an intentional limitation in the specification](https://github.com/w3c/webcomponents/issues/587). It will only work if you use the `class` syntax directly in the browser without compiling the code first.