Questions tagged [lwc-dom]

The tag has no usage guidance.

Filter by
Sorted by
Tagged with
1 vote
0 answers
32 views

LwcWebpackPlugin with AliasModuleRecord for lwc.dev isn't loading HTML file for component

I use LwcWebpackPlugin to load Lightning Web Components. Everything works fine but because I want to load compoennts from 'lwc' direcotry the namescape won't work. I must get components from /lwc ...
0 votes
1 answer
22 views

How to track change on an Account field in LWC?

Whenever I change a specific field (for example Account Name), I want to set a template if:true to false, in order to hide an element. I'm using @wire to get the account name from the record page, as ...
  • 3
0 votes
1 answer
21 views

How to update data on unrelated components?

So I have two unrelated components on one page. And when items are added\deleted on the first one they need to be displayed in second component. I use this: eval("$A.get('e.force:refreshView')....
  • 21
1 vote
0 answers
24 views

Uncaught Reference Error : newAge is not defined throws at "myPlaygroundLink"

The component I wanna create should recieve input from user and update newAge variable that I have defined and should console log it, but when I try to enter value this popup comes with error ...
3 votes
0 answers
52 views

Implementing jstree library with Lightning Web Component

This will be a long one, hoping someone can help. Problem Summary: I'm unable to integrate the "Drag and Drop" (dnd) plugin functionality with my LWC that utilises the jstree library (https:/...
  • 151
0 votes
0 answers
27 views

How to get cell changes from multiple lightning data tables with one button outside lightning data tables in LWC?

I have a requirement to edit multiple opportunities and opportunities' lines. For each opportunity, I have 3 lightning data tables (1 for Opportunity, 1 for Opportunity Technology Lines, 1 for ...
  • 21
1 vote
1 answer
145 views

Chart Js: How to display data values in chart js bars

I have built simple bar chart with ChartJS version v2.8.0, so now I am trying to display the data values on each bars using chartjs-plugin-datalabels v1.0.0 plugins chartjs-plugin-datalabels I have ...
  • 11
3 votes
1 answer
61 views

How to sort the elements is lightning-dual-listbox based on the label?

I am trying to sort the elements in the dual list box, unfortunately i did not find any correct way to do it. This is my html component <template> <lightning-dual-listbox name="...
  • 37
0 votes
1 answer
65 views

LWC jest test on conditional element

How can I test if:true element in my lwc? showLoadingSpinner is @api. I am new to jest, sorry if stupid question. Console log shows null. <template if:true={showLoadingSpinner}> <div id=&...
  • 25
0 votes
1 answer
41 views

How to retain user-input in lightning input field

I created an LWC in which I have 3 parts on a page: (here Allergy & Medication are visible). 1st page has 2 input fields, and to view each part of the page, a boolean variable is used (template ...
2 votes
0 answers
44 views

undefined value from html button value attribute

I am iterating an array in template and on the button click I am trying to get the value of selected element but the value coming is undefined <template> <template for:each={pages} for:...
  • 932
0 votes
0 answers
54 views

LWC Filter contacts

I have the following drawback: my parent LWC shows a list of contacts with their related details. But I need to filter these contacts based on an input, typed in by the user. In this case, the channel ...
0 votes
0 answers
124 views

Dynamic list view in LWC with a combobox

I have this problem: I have a LWC that shows my contact details. But I want to add a checkbox to filter my contacts based on a picklist field. I'm thinking of doing it in two ways: Call Apex with a ...
0 votes
1 answer
532 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
0 votes
0 answers
80 views

Is it right way to check CRUD Permission in LWC?

import { LightningElement, wire } from 'lwc'; import { getObjectInfo } from 'lightning/uiObjectInfoApi'; import ACCOUNT_OBJECT from '@salesforce/schema/Account'; export default class CheckPermission ...
  • 1
0 votes
0 answers
59 views

How to access window.ApplePaySession in LWC?

I am working on apple pay integration using LWC. So far, I am able to access the window.ApplePaySession in my safari browser console but in LWC it's showing undefined. I have also tried with static ...
0 votes
1 answer
304 views

How to select an element inside a template if true in LWC Jest test?

I have an LWC app that has a lightning-input and a lighning-button. It fetches data from the server for a record whose ID is specified. I have successfully mocked the server calls. I am trying to ...
0 votes
1 answer
169 views

Cannot change or access class member variables from callback function

In the below code, the function dragstarted() is D3 JS function that gets called everytime a graph node is clicked (which gets called fine). However, it is not possible to change 'clicked' or call '...
1 vote
1 answer
171 views

Do something every time an @api property value changes in child component [duplicate]

I am passing a property from a parent to a child component. I am trying to perform a task every time the value passed from a component's parent to itself changes. export default class displayData ...
10 votes
1 answer
2k views

Order of execution of @wire in lwc

I know that @wire methods are always executed once our component is loaded. I want to dig deep into this and want to understand the order of execution with respect to the component's life cycle. When ...
3 votes
0 answers
197 views

LWC Responsive Tables In Light DOM

I'm trying to build a div-based responsive table in LWC using Salesforce's new "Light DOM" feature. Unfortunately the table won't render properly, it looks like this: Following is the html-...
  • 31
0 votes
0 answers
168 views

jest dom is not updating after element.innerText is set imperatively

I am testing a component that renders a table. Each row of the table body has a column that contains a button, when the button is pressed a javascript handler modifies the cell by setting the ...
  • 2,667
0 votes
0 answers
33 views

LWC Could show checkbox group inside lightning-tabset correctly

In order to provide users with a UI in which he could select some products with groups of products based on global category I am trying to show lightning-checkbox-group inside lightning-tabset, this ...
0 votes
1 answer
369 views

Resetting rich text area in lwc record edit form

I have a lwc with the following code in html <template> <lightning-record-edit-form object-api-name={object} onsuccess={handleRecordCreate}> <lightning-messages></...
  • 1,123
1 vote
3 answers
3k 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, ...
0 votes
1 answer
56 views

Communicating between parent and child which is multiple levels deep

So I have parent component and child components as so <parent> <childl1 contracts = {contracts} oncontractsupdate = "handleContractsUpdate"> <childl2 contracts = {contracts}...
0 votes
1 answer
549 views

Open multiple accordion section using active-section-name not working as expected

i tried to create accordion section dynamically by constructing the section name and the data inside accordion in the JS file. Method in JS will call apex method that will deserialize JSON response ...
0 votes
1 answer
897 views

How to use spinner (LWC) with setTimeout

I have an LWC component that has a spinner in it as shown below <template> <form> <div if:true={isLoading}> <lightning-spinner alternative-text="...
  • 15
0 votes
1 answer
81 views

Overlay Library - using referenceSelector to reference Element in Child Component

I have a parent aura component in which I have <lightning:overlayLibrary aura:id="overlayLib"/> included. I want the popover to be displayd next to a DOM element which exists inside a ...
1 vote
0 answers
226 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 ...
1 vote
1 answer
179 views

Setting class name dynamically in LWC

I want to add class to a div dynamically,something like this : <div class={getShowHideClassesInvoicesAndPayments} > #!----content-# </div> Javascript: ...
0 votes
0 answers
56 views

This is my LWC and I want some flexibility in it

I want flexibility so that in the first row it ends with 105 and in the next row it starts with 201; it means it automatically creates a row start with initials 1,2,3 and it means if it ends with 105, ...
0 votes
1 answer
560 views

How to test methods that change object fields (and some others methods) not decorated with @api using JEST in LWC

My LWC application includes a modal window and is written for use in Salesforce and uses Apex. I had a hard time writing tests for some functions, but I couldn't test the application until the end. I ...
2 votes
1 answer
62 views

Pass param to JS from html for rendering during iteration? [closed]

I want to check if the metadata.datatype === 'Checkbox' although i am not able to pass the param from html to js in LWC. Code: <template> <template for:each={caseMetadata.data} for:item=&...
0 votes
1 answer
91 views

How to over come the error :- The `innerHTML` property is available only on elements that use the `lwc:dom="manual"` directive?

On click of a div i am trying clear the content and I am making it editable. so when i try to get the innerHTML it has no issues but when i try to modify the innerHTML , i get a console error as below ...
2 votes
1 answer
132 views

LWC and export module this context

I have a util function where I used the toast message function: import { ShowToastEvent } from "lightning/platformShowToastEvent"; const showToast = function (toastTitle, toastMessage, ...
  • 23
0 votes
0 answers
341 views

Button-menu-item's displays below DIV's with higher z-index

I'm creating a process design App with process steps. Each process step is represented by a child LWC component having a container div with a different z-index, to allow correct placement and drag &...
  • 16
0 votes
0 answers
56 views

LMS retrieval/update lags 1 click behind

It seems that the component relying on the URL update doesn't get the correct mediaId from the URL. The first click gets the Something went wrong.... <template>, then each following click is 1 ...
0 votes
1 answer
399 views

Lightning Datatable not rendering

I am facing a intermittent issue where my datatable is not rendering. It does render first time. Basically, its takes data from a parent component (opps). In below snippet the paginator components ...
0 votes
2 answers
511 views

LWC: change class of lightning-input checkbox depending on status

I need to give a checkbox a class name depending on whether the checkbox is checked or not. The checkbox is being displayed inside a lwc template. How can I achieve this? <template for:each={...
  • 159
0 votes
1 answer
140 views

How i can convert this toggle Aura into LWC

I am not able to convert Controller in LWC JS below is my code to show toggle or helptext Aura Component <aura:component > <div class="slds-form-element"> <div class="...
  • 13
0 votes
1 answer
101 views

onRender event but not after every save

I have a simple component that just pops up a browser alert if a specific field is filled in when the page finishes rendering. I'm not too familiar with the different DOM events and when they fire, ...
  • 63
0 votes
1 answer
1k views

Error during LWC component connect phase: [Maximum call stack size exceeded]

I am trying to assign value to a property of my parent component's constructor method. Below is the html code: <template> {welcomes} <c-testfile></c-testfile> </template&...
0 votes
1 answer
103 views

Payload not getting updated by method in setter

Trying to write a getter and setter method to simply update my JSON payload to have name.first be the student's first and last name so that way the lightning-button can show as their full name, this ...
0 votes
1 answer
63 views

Struggling to find correct data-bind structure for JSON payload

I am having trouble rendering multiple for:each loops inside of each other and am pretty sure it is the structuring of how I have it. But I am not seeing where the issue is taking place. So when I ...
0 votes
0 answers
266 views

ERROR : There were errors while compiling component

Can anybody please help me out in solving this issue ERROR IN LOCAL DEVELOPMENT ORG : Couldn't find the compiled component. If this component has a dependency on a component in the org or a component ...
0 votes
0 answers
95 views

DOM handling in Experience Builder: Components inserted via code vs. drag and drop

I'm trying to set up a component registration process as described here . This works fine for the component c-sub-navigation, which I inserted manually. The second component c-knowledge-display is ...
0 votes
1 answer
412 views

How to remove this huge distance between label and input in LWC?

How to remove this huge distance between label and input in LWC. I didn't use custom styles, only from the salesforce lightning design system. Here's my code from the HTML file: <div> &...
0 votes
1 answer
58 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.
  • 750
0 votes
1 answer
164 views

LWC constructor and wire adapter

Already wire adapter was there in LWC i.e. @wire annotation to display the records,so can we do the same thing (display the records) through LWC constructor also? If yes, then why @wire feature was ...