fix(hydration): force native shadow when synthetic exists

[nolanlawson]

Details

This PR makes it so that, when synthetic shadow DOM is loaded on the page, hydrateComponent still works, but it forces any hydrated components into native mode (since synthetic shadow mode is not supported for SSR+hydration). This means that SSR+hydration+native can work even when synthetic shadow is loaded on the page.

It also adds a test to confirm that this works.

Does this pull request introduce a breaking change?

• ✅ No, it does not introduce a breaking change.

Does this pull request introduce an observable change?

• ✅ No, it does not introduce an observable change.

[lpomerleau]

So to use this on a page which contains both SSRed and CSRed content, we:

• include the synthetic shadow polyfill in the base doc
• set ENABLE_MIXED_SHADOW_MODE to true
  ? Or do we not need mixed shadow mode at all?

[nolanlawson]

@lpomerleau You do not need to set a flag for mixed mode. The current flag is for legacy behavior with static shadowSupportMode = 'any' and should be removed eventually.

[divmain]

I think it is unfortunate that synthetic continues to live on. But this PR looks reasonable.