If I have a property called markers in my component, which is exposed using the @api notation. How can I make sure that it contains the correct values after the component goes through the jest unit test?

I know that using the following throws an error, because the property is being passed as undefined:




Expected value to have a 'length' property that is a number. Received:

However, I have the lightning-map component around a template tag in which the condition to be rendered is that the mapMarkers property mustn't be null or empty:

<template if:true={mapMarkers}>

And the following assertion passes:


Which means, in my understanding, that the map component should be rendered on the screen.

  • 2
    It might be worth cross posting this onto Stackoverflow: jestjs because there are over 5,793 questions tagged with jestjs there, so the pool of people with relevant experience might be bigger
    – Robs
    Apr 28, 2019 at 10:34
  • I don't think this would help. The problem is basically "how to access the component's properties during assertion." This has little to do with Jest, and more with how LWC's createElement method works, and how the component's attributes should be accessed (looking into the sample tests one might get the impression that they shouldn't, but that doesn't sound a good thing). Apr 28, 2019 at 22:04

1 Answer 1


Turns out that it is possible to get the component's attributes in a simple way, just accessing them directly, like:


The catch here is that you have to "return a promise in the unit test, to wait for any asynchronous DOM updates. Jest will automatically wait for the Promise chain to complete before ending the test and fail the test if the promise rejects."

So the last lines of the test method look like this:

it('Should render the map with two markers.', () => {

    // ... mocking, instancing, etc

    // asserts the child component is rendered in our component

    // asserts the property is properly populated with the information
    // that comes from the database (which was mocked in the beginning
    // of the test)
    return Promise.resolve(() => {

This solution was found on a snippet on the blog post "Unit Test Lightning Web Components with Jest", under the section "Salesforce specifics".


You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .