3

I have an input field that reads a value from an api property. Everything works fine except when I try to write a test Test to mock the data. I am assuming that I must be making some kind of mistake in my formatting.

The fields in question grab a a value from an object passed in via a public property. When I try to run a Jest test I get an error that

<template if:true={dataLoaded}>
        <div class="screen">         
                <lightning-input label="Parent First Name"
                                 type="text"
                                 value={patient.LegalGuardian__r.FirstName}
                                 onchange={handleChange}
                                 name="firstName"
                                 required
                                 data-id="parentFirstName">
                </lightning-input>
                <lightning-input label="Parent Last Name"
                                 value={patient.LegalGuardian__r.LastName}
                                 onchange={handleChange}
                                 name="lastName"
                                 required
                                 type="text"
                                 data-id="parentLastName">
                </lightning-input>
                <lightning-input label={labels.parentVerificationText}
                                 class="slds-required"
                                 required
                                 type="Checkbox">
                </lightning-input>

        </div>
 </template>

Mock JSON file

{
  "FirstName": "Adult",
  "LastName": "Patient",
  "LegalGuardian__r.FirstName": "test",
  "LegalGuardian__r.LastName": "Guardian",
  "RecordTypeId": "01209000000IlhyAAC",
  "LanguagePreference__pc": "English",
  "Age__pc": 50,
  "Id": "0017Z00001WcRoPQAV",
  "RecordType": {
    "Id": "01209000000IlhyAAC"
  }
}

This works just fine in practice. But whenI try to pass a JSON file to the API in a Jest test I will get errors that that the properties FirstName and LastName are undefined. I tried to pass it with JSON.parse() but that did not solve it. Is there some way to format the JSON so that it works in my tests when passed as a public property?

I have expirmented with trying to return the value with a getter to help with testing. But the test still throws the same error.

get guardianLastName() {
    return this.patient.LegalGuardian__r.LastName !== undefined
      ? this.patient.LegalGuardian__r.LastName
      : '';
  }
1
  • could you show your JEST test for this? Feb 23 at 20:02

1 Answer 1

4

As a __r field references a single object for a parent reference, something more like this is needed:

{
    ...,
    "LegalGuardian__r": {
        "FirstName": "test",
        "LastName": "Guardian"
    },
    ...
}
3
  • 3
    +1 - when in doubt, you could always see what it contains in real-world usage console.log(JSON.stringify(this.patient)); to build off of Feb 23 at 20:05
  • That is what the JSON is built from. I copied the JSON.stringify() from the console. Thought I was being clever. Feb 23 at 20:33
  • That solved it. Thank you for the help! Feb 23 at 20:45

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.