Questions tagged [shadow-dom]
The shadow-dom tag has no usage guidance, but it has a tag wiki.
20
questions
1
vote
0
answers
60
views
Nested slot tags inside synthetic shadow
We try to test automatically our Sales Force application via Playwrigth.But to steer page components we'd like to fully understand synthetic Shadow polyfill.
How it's possible to have 2 synthetic ...
0
votes
1
answer
3k
views
LWC add custom data-type checkbox and extending lightning-datatable
I have a requirement where I have implemented the lightning-dataTable with the custom-dataType column checkbox.
As you can see in the screenshot, I have a requirement where
onCheck of the parent row(...
- 11
2
votes
3
answers
13k
views
How to use querySelector inside forEach in HTML file of LWC bundle?
This might be super easy but I am stuck. I have a lightning card inside forEach on the template. In Javascript, I need to find the card, and add dynamic css based on some business logic. However, ...
- 445
1
vote
0
answers
702
views
Inject Angular JS in LWC
We have a proper Angular JS 1.4 application with App, Controller and service layers that works in VF page which we need to replicate exactly in LWC.
We have tried using LWC:dom="manual" to ...
- 11
0
votes
1
answer
111
views
Correct representation of DOM in LWC?
Sharing my visual understanding of DOM.
Please let me know if this is correct?
Also please do share more useful material or your viewpoints. Will be helpful.
- 748
0
votes
1
answer
693
views
Access dom element from <head> in experience builder
I am trying to access a dom element from the in lightning experience by adding the script
<script type="text/javascript">
document.addEventListener('DOMContentLoaded', ()=> {
...
- 51
1
vote
1
answer
248
views
Rendered LWC has no extra attribute in rendered element
I have a lightning web component that renders extra attributes in its HTML elements (as expected) which is the correct behavior according to the documentation:
To ensure CSS encapsulation, each ...
- 354
0
votes
2
answers
206
views
Salesforce Dom dynamic behaviour
Last week the structure is with li elements and now the HTML structure is changed. This is for Salesforce Contacts object.Please see the image.
<div id="suggestionsList">
<ul&...
- 3
1
vote
1
answer
966
views
LWC render nested component within lightning-record-edit-form
I am working on building a LWC that componentizes lightning-record-edit-form, but the form cannot evaluate the lightning-input-field when the fields are nested within another component.
The basic ...
- 78
4
votes
2
answers
6k
views
LWC -- How to check if user click is outside of a component inside the component's JS?
I have a simple tooltip (not modal) that after it is opened if the user clicks outside of the component it should close.
In aura, we were able to do this pretty simply by adding a function in the ...
- 67
3
votes
2
answers
1k
views
CSS class not getting added to the LWC
I Have created an LWC component with following files
.HTML file
...
<lightning-datatable
key-field="id"
data={data}
columns={columnsInProgress}
is-loading={tableLoadingState}
...
0
votes
1
answer
3k
views
Lightning Datatable - Dynamically Hide actions for specific rows on the basis of data
I have a lightning data table with some columns and row-actions. These row actions are configured dynamically on the basis of row data. For example, If I am fetching some Payments data into my table ...
8
votes
2
answers
1k
views
Event propagation with bubble true in LWC
I'm trying learn event propagation in LWC. As per the documentation it says {bubble: true, composed: false} means the event does not cross the shadow boundary, but it bubbles up the shadow boundary. I ...
- 267
6
votes
1
answer
877
views
Inconsistencies between shadow DOM and synthetic DOM on LWC OSS
We've been working on porting our LWC components from platform into LWC OSS. In order to do this, we have a copy of SLDS classes we have created and we need them to be applied globally.
For us it will ...
- 141
2
votes
4
answers
4k
views
Adjust and fix appearance of lightning-map LWC component
In my Lightning Web Component, I am using the <lightning-map> Base Component to display a Google map.
I have a few display issues and things I would like to adjust, but It doesn’t work as ...
- 37.2k
8
votes
3
answers
15k
views
How to make buttons in a lightning-datatable smaller in LWC?
I have a lightning-datatable in my Lightning Web Component (LWC) that has several buttons in each row (first button only shown here):
These standard-sized buttons consume quite a lot of vertical ...
- 134k
1
vote
0
answers
112
views
Why LEX is sometimes rendering <slot>-elements (shadow DOMs) on same flexipage for one user but not for the other user?
The core question is reduced and skipping the "Why do I ask this and what do I want to achieve?". Read the "Background notes" at the end, if you want to know the ugly truth...
Core question
Why LEX (...
- 28.2k
2
votes
1
answer
2k
views
lightning:icon pointing to SVG static resource has empty shadow root
An working SVG icon stored in a public static resource myicon_svg
<?xml version="1.0"?><svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100"><g id="...
- 37.2k
1
vote
0
answers
2k
views
Manipulate DOM of LWC using jQuery [duplicate]
I know I cannot do:
var elements = this.template.querySelectorAll('[id^="fieldName"]')[0];
elements[0].getElementsByTagName('lightning-formatted-text')[0].setAttribute("style:", "myCSSAttribute:...
- 11
14
votes
1
answer
10k
views
Understanding shadow dom in Lightning web components
I'm looking at the shadow Dom in the lwc developer guide and found below statements.
Shadow DOM is a web standard. To make development easier for component authors, the Lightning Web Components ...
