What are Web Components?

Web components allow us to create custom, reusable html tags to be used in web pages and web apps. The advantage of web components is, they work on all the modern browsers with out the need of any third party libraries.

Sample Web Component

Let's use the sample web component (show in the screenshot below) to see how search engines parse them.

This sample page is available here: Sample Web component

Google bot and Web Component

Now lets use the Google bot / Google URL Inspection tool to inspect the above page. This tool will parse the page, as if the Google's search engine/Google bot is parsing it. From the image below, you can see the parsed text ( 'Hi Steve, from Web Component') message inside the web component

Bing bot and Web Component

Now, let's use Bing bot / Bing URL inspection tool to parse the same page From the image below, you can see the parsed text is NOT available inside the web component

Verdict

If you are depended on search traffic from Bing, do NOT use web components for contents that will be used by search engine to drive trafffic to your site. You could still use web components, if the content inside it is not important for SEO (for example, a calendar widget).

Diclaimer

The above tests were conducted on December, 2020. Since the search engines bots (Both Google and Bing) are evengreen in nature, there is a possibility Bing bot might soon add support for parsing Web components.