Mixed shadow mode is available as a developer preview with Sprint'23 release

 

Build Components in Mixed Shadow Mode (Developer Preview)


With mixed shadow mode, Lightning web components can use native shadow DOM even when the synthetic shadow polyfill is applied.

Where: This change applies to custom Lightning web components in Lightning Experience, Experience Builder sites, and all versions of the Salesforce mobile app. This change also applies to Lightning web components open source.

Note
NOTE Mixed shadow mode is available as a developer preview. This feature isn't generally available unless or until Salesforce announces its general availability in documentation or in press releases or public statements. All commands, parameters, and other features are subject to change or deprecation at any time, with or without notice. Don't implement functionality developed with these commands or tools.

Why: All major browsers now support shadow DOM. Salesforce maintains the synthetic shadow polyfill for legacy browsers such as older versions of Microsoft Edge. To simplify development and testing, the polyfill is used even on browsers that support shadow DOM. With mixed shadow mode, you gain the speed and efficiency of using native shadow as much as possible in your app. And you can more readily migrate to use native shadow fully in the future.

How: Mixed shadow mode is disabled by default. Contact Salesforce Customer Support to enable mixed shadow mode.

To enable mixed shadow mode on a component, set the static shadowSupportMode property to any.

// native.js
import { LightningElement } from 'lwc';

export default class NativeComponent extends LightningElement {
    static shadowSupportMode = 'any';
}

Valid values for shadowSupportMode include:

  • any—Renders the whole component subtree in native shadow DOM where possible. If the browser doesn't support shadow DOM, the subtree renders in synthetic shadow.
  • reset—Enables a subclass to opt out of receiving the shadowSupportMode value from its superclass. reset applies only if the component’s superclass is using any and no parent components are using any.

Lightning Experience and Experience Cloud include the synthetic shadow polyfill by default. When the polyfill is present, reset defaults to synthetic shadow. If the polyfill isn't present, such as in Lightning Out or LWC Open Source, shadowSupportMode has no impact and components render in native mode.

By default, slotted content is rendered in native shadow. Slotted content isn’t descended from the component it’s nested in, so you can slot synthetic shadow content into a native shadow component. This also means that slotted content isn’t affected by how your browser renders the #shadow-root of the component containing the slot. For example, if your browser renders a native component in synthetic shadow, native content slotted into that component is still rendered in native shadow.

Comments

Post a Comment

Popular posts from this blog

IsVisibleInSelfService on Task salesforce

I was working on assignment which required me to access Tasks and show on customer portal. I written the apex code and fired SOQL, but to my surprise none of Tasks were fetched. I thought its a permission issue from profile or sharing access issue. However at the end I found that there is a field on task object called  IsVisibleInSelfService  which derives the visibility of the tasks for customer portals. Even Apex code can't find the task if this boolean field is not set to true. Probably its trivial information but usefull when you are not aware of this :)
Read more

Too many batch retries in the presence of Apex triggers and partial failures.

Too many batch retries in the presence of Apex triggers and partial failures If you write and execute batch scripts then some time you might end up with this error, which may be difficult to understand. However proper explanation is given in the Salesforce documentation as below. Bulk DML Exception Handling Exceptions that arise from a bulk DML call (including any recursive DML operations in triggers that are fired as a direct result of the call) are handled differently depending on where the original call came from: When errors occur because of a bulk DML call that originates directly from the  Apex  DML statements, or if the  all_or_none  parameter of a database DML method was specified as true, the runtime engine follows the “all or nothing” rule: during a single operation, all records must be updated successfully or the entire operation rolls back to the point immediately preceding the DML statement. When errors occur because of a bulk DML call that ...
Read more

Governor limit SOQL 101 being suppressed

System.LimitException: Too many SOQL queries: 101 Did anyone faced scenario where SOQL 101 governor limit is not being reported to user interface (UI), instead it is being logged into debug logs ? Please provide your thoughts in the comments if there exists any possible scenario. As far as I know, Governor limits can not be suppressed and will be shown to user on the UI. However I am facing below scenario where SOQL 101 limit is being logged into debug log and not being shown in the UI. 1.User converts the lead. 2.Account, Opportunity, Contact created. 3.User is successfully redirected to newly created account page. 4.All the references are correct. Like ConvertedAccountId, convertedOpptyId etc. When I go to the Debug logs, There SOQL 101 (System.LimitException: Too many SOQL queries: 101) is being shown. If dig more in the debug logs then I found that this exception came while Opportunity Before Update trigger. The question is, Since all this is happening in sing...
Read more