{"version":"1.0","provider_name":"Ionic Blog","provider_url":"https:\/\/ionic.io\/blog","author_name":"Mike Hartington","author_url":"https:\/\/ionic.io\/blog\/author\/mike","title":"Shadow DOM in Ionic (and Why it's Awesome)","type":"rich","width":600,"height":338,"html":"<blockquote class=\"wp-embedded-content\" data-secret=\"Ayv6ocVjrM\"><a href=\"https:\/\/ionic.io\/blog\/shadow-dom-in-ionic-and-why-its-awesome\">Shadow DOM in Ionic (and Why it&#8217;s Awesome)<\/a><\/blockquote><iframe sandbox=\"allow-scripts\" security=\"restricted\" src=\"https:\/\/ionic.io\/blog\/shadow-dom-in-ionic-and-why-its-awesome\/embed#?secret=Ayv6ocVjrM\" width=\"600\" height=\"338\" title=\"&#8220;Shadow DOM in Ionic (and Why it&#8217;s Awesome)&#8221; &#8212; Ionic Blog\" data-secret=\"Ayv6ocVjrM\" frameborder=\"0\" marginwidth=\"0\" marginheight=\"0\" scrolling=\"no\" class=\"wp-embedded-content\"><\/iframe><script type=\"text\/javascript\">\n\/* <![CDATA[ *\/\n\/*! This file is auto-generated *\/\n!function(d,l){\"use strict\";l.querySelector&&d.addEventListener&&\"undefined\"!=typeof URL&&(d.wp=d.wp||{},d.wp.receiveEmbedMessage||(d.wp.receiveEmbedMessage=function(e){var t=e.data;if((t||t.secret||t.message||t.value)&&!\/[^a-zA-Z0-9]\/.test(t.secret)){for(var s,r,n,a=l.querySelectorAll('iframe[data-secret=\"'+t.secret+'\"]'),o=l.querySelectorAll('blockquote[data-secret=\"'+t.secret+'\"]'),c=new RegExp(\"^https?:$\",\"i\"),i=0;i<o.length;i++)o[i].style.display=\"none\";for(i=0;i<a.length;i++)s=a[i],e.source===s.contentWindow&&(s.removeAttribute(\"style\"),\"height\"===t.message?(1e3<(r=parseInt(t.value,10))?r=1e3:~~r<200&&(r=200),s.height=r):\"link\"===t.message&&(r=new URL(s.getAttribute(\"src\")),n=new URL(t.value),c.test(n.protocol))&&n.host===r.host&&l.activeElement===s&&(d.top.location.href=t.value))}},d.addEventListener(\"message\",d.wp.receiveEmbedMessage,!1),l.addEventListener(\"DOMContentLoaded\",function(){for(var e,t,s=l.querySelectorAll(\"iframe.wp-embedded-content\"),r=0;r<s.length;r++)(t=(e=s[r]).getAttribute(\"data-secret\"))||(t=Math.random().toString(36).substring(2,12),e.src+=\"#?secret=\"+t,e.setAttribute(\"data-secret\",t)),e.contentWindow.postMessage({message:\"ready\",secret:t},\"*\")},!1)))}(window,document);\n\/\/# sourceURL=https:\/\/ionic.io\/blog\/wp-includes\/js\/wp-embed.min.js\n\/* ]]> *\/\n<\/script>\n","thumbnail_url":"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2018\/08\/shadow_dom_ionic.jpg","thumbnail_width":1400,"thumbnail_height":800,"description":"It lurks in the shadows&#8230;creating hidden trees&#8230;playing by a set of its own rules&#8230;it&#8217;s\u2026 SHADOW DOM! But, what exactly is Shadow DOM? Put simply, Shadow DOM is an API that is part of the Web Component model. It helps to isolate component internals, protecting users from breaking changes and global CSS. I\u2019d like to think [&hellip;]"}