-1

Quick Action contains LWC Component, after clicking on quick action button multiple screens are appearing:

step 1. clicking on quick action button,it contains lwc component below screen will appear first (just with close icon)

enter image description here

step 2. Next, one more screen will load with spinner

enter image description here

step 3. Then final result will appear in screen 3

Question here is : Before displaying result(step 3), 2 screen will load, Is it possible to by pass either screen1/screen2?

Expectation : After Clicking quick action spinner has to appear then immediate result(Step3)

LWC:

   <template>
   <div class="slds-is-relative">
   <template if:true={isLoaded}>
    <div>
      <lightning-spinner alternative-text="Loading" class="spins" size="large"
    variant="brand">
    </lightning-spinner>
    </div>
    </template>
    <template if:true={account}>
   <lightning-formatted-rich-text value={account.Discount_1__c}
   id="rateDiscount_1__c">
   </lightning-formatted-rich-text>
   </template>

JS:

 import { CurrentPageReference } from 'lightning/navigation';

 export default class ****** extends NavigationMixin(LightningElement) {
 @api recordId;
@api isLoaded = false;
account;


     @wire(CurrentPageReference)
       getStateParameters(currentPageReference) {
      if (currentPageReference) {
       this.recordId = currentPageReference.state.recordId;

      }
      }

       connectedCallback() {
       this.getAccount(this.recordId);
     }

      getAccount(recordId) {
      this.isLoaded = true;
     getWkRateDetails({
       acId: this.recordId
       }).then(result => {
     this.account=result.account;
      this.isLoaded = false;
       }).catch(error => {
      }
       });

   }

CSS:

 .spins {
  position: absolute;
  content: 'Loading...Hang Tight...';
  width: 100%;
  text-align: center;
  top: calc(50% + 3em);
  font-weight: bold;

}

I posted similar kind of question but there LWC embedded with aura frame work

Multiple screens are appearing in quick action while loading lwc from aura

One more wired behavior I observed in quick action,

  1. Click on quick action button ( button contains lwc)
  2. page will load with standard spinner
  3. custom spinner will load (step 2)
  4. Dont close the modalNow just refresh the URL
  5. Screen will appear with spinner but itsnot calling any connected call back(), renderedcallback() method.(Like screen will stuck, not able to fetch the recordId in CurrentPageReference method)
4
  • 1
    your question title says "multiple spinners" but that doesn't seem to be what you're describing. You may want to look at using lightning-quick-action-panel for a consistent experience with standard quick action in terms of spinner + then content (see create screen quick actions) Aug 22 at 13:54
  • after clicking the button. I can able to see 2 intermediate screens before getting required data. that I need to avoid. Aug 22 at 13:57
  • already updated the questions. Downvoter please feel free to explain what's your expectation already @Damecek tried and seen the same behavior. This question is correct and provided all the information too Aug 23 at 2:47
  • 2
    Didn't downvote, but have you looked at the behavior of a normal QA (create record) with no custom component? It behaves the same with a blank screen first (although subtle and probably quicker). There's nothing you're going to do to change this behavior on your own and it isn't related to you using LWC. You can use lightning-quick-action-panel to put your information in and that improves the behavior a bit in my testing (and adds its own loading icon), but if you need to wait longer and add your own spinner within your LWC - there will be two. Aug 23 at 13:36
1

I tried to display just plain Hello world text without js and still as you mentioned 2 screens appeared before the Hello world appeared. So from this I assume that it is within the salesforce implementation of this feature and cannot be bypassed. But I noticed that if your browser caches the action, it then renders it without the screens/delay.

1
  • even i noticed the same. but again if user refresh the browser url. then 2 screens will appear again. iI will wait for other answers.is there anyway to avoid it Aug 23 at 1:26

Not the answer you're looking for? Browse other questions tagged or ask your own question.