4

I have a strange problem with the component and I don't know what more can i do, I'm having this problem whenever I put the lwc inside the recordPage of a custom object but in a standard recordPage object it work also in IE 11, but in Firefox & Chrome no.

This is what it looks like in Lightning app builder:

enter image description here

But when I go back to the record page I find this problem:

enter image description here

When I display the same code in another sandbox, the component works perfectly.

How do I load the static resource styles:

import { loadStyle } from 'lightning/platformResourceLoader';
import styles from '@salesforce/resourceUrl/rep_sr_datatableStyles';

....

 renderedCallback() {
    Promise.all([
        loadStyle(this, styles)
    ]).then(() => {
        window.console.log('Files loaded.');
    }).catch(error => {
        window.console.log("Error " + error.body.message);
    });
}

rep_sr_datatableStyles => is a static resource that it have just a file .css

2

This is a known issue in salesforce. https://success.salesforce.com/issues_view?id=a1p3A000001SHoDQAW

1

I believe you need to specify the file inside the static resource.

If the css file were named style.css inside the zip / static resource, it'd look like this:


import { loadStyle } from 'lightning/platformResourceLoader';
import styles from '@salesforce/resourceUrl/rep_sr_datatableStyles';

....

 renderedCallback() {
    Promise.all([
        loadStyle(this, styles + '/style.css') //specified filename
    ]).then(() => {
        window.console.log('Files loaded.');
    }).catch(error => {
        window.console.log("Error " + error.body.message);
    });
}

Also, you could do away with the Promise.all if you're really only needing to only load the one file.

loadStyle(this, styles + '/style.css')
  .then(() => console.log('files loaded'))
  .catch(error => console.log("Error " + error.body.message))

Reference: https://developer.salesforce.com/docs/component-library/documentation/lwc/lwc.create_third_party_library

  • If you load just a file in the static resource you can use "loadStyle(this, styles)", but if you look the first image you can se that the styles is applied. The problem that i have is that if I put the component in a recordPage of a custom object I get the error(Second image) in Chroome and Firefox, but in IE11 it works everywhere. – Alex M. May 29 at 6:41
  • Gotcha. I made an lwc and uploaded css file without zip and it worked via app builder and on a record page. I made a gist of that lwc, curious to see if it works for you too: gist.github.com/jsmithdev/53e2bcdbd077f7e2fed5ee8a0ee1924f – Jamie Smith May 30 at 3:06
  • Try displaying it on a custom object record page. Because if I implement it in Account, it works, but if I create a tab for a custom object, the "loadStyle" function does not work. – Alex M. May 31 at 11:45
  • I made sobject Unicorn, made tab and seems to be working: i.imgur.com/w2Xl1wD.png – Jamie Smith May 31 at 21:09
  • Pff, I don’t understand anything. I’m having this problem whenever I use it on a custom object. It can be by the configuration of the project, the version of the sandbox or the Visual Studio? – Alex M. Jun 1 at 22:30

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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