Enzyme: Cannot read property 'toUTCString' of undefined

[ummahusla]

I testing out one of the react components and came across a weird issue. When I try to shallow the component, I get "before each" hook: Cannot read property 'toUTCString' of undefined. It's clearly something I not expect.

I've done a small researched and I found that a lot of people were struggling with toString() method as well and seems to be fixed, but issue toUTCString() with still exists.

Issues: #519, #453, etc..

Update: I've tried to replace toUTCString with toString still got the same issue TypeError: Cannot read property 'toString' of undefined.

---

Component

const ConversationMessage = ({author, text, date, isOutGoing}: ConversationMessageProps) => (
  <div className="row">
    <div className={"col-md-8 " + (isOutGoing ? "col-md-offset-4 out-going" : "not-out-going")}>
      <div className="message-body-wrap">
       ...
      </div>
      <div className="message-meta-data">
        <p>
          {author} - {date.toUTCString()}
        </p>
      </div>
    </div>
  </div>
);

---

Test

const message = [{
  "author": "Geoff Winters",
  "text": "test",
  "date": "2016-11-15T12:08:00",
  "isOutGoing": true
}];

var wrapper;

beforeEach(() => {
  wrapper = shallow(
    <ConversationMessage
      author={message.author}
      text={message.text}
      date={message.date}
      isOutGoing={message.isOutGoing}
    />
  );
});

describe('Conversation Message Component', () => {
  it('should have correct values ', () => {
    console.log(wrapper.debug());
    expect(wrapper.find('div').first().hasClass("row"));
  });
});

[ummahusla]

Yeah, sorry I've fixed it as well, just forgot to update the issue. I think
that was the main issue but anyway using momentjs was a good solution on my
case. Thanks

On 5 December 2016 at 15:00, Brandon Dail [e-mail] wrote:

@ummahusla https://github.com/ummahusla looking at your test case,
message is an array with a single object, but in your beforeEach hook
you're treating it as an object (message.date instead of message[0].date),
so I would expect message.toString and message.toUTCString to be undefined

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/airbnb/enzyme/issues/716#issuecomment-264875867, or mute
the thread
https://github.com/notifications/unsubscribe-auth/ACayoOsZeA4qmleUc1GqmdOVWuk-_teZks5rFCclgaJpZM4LEIkQ
.

[ljharb]

You were passing a string as a date, and the prop expected a date object.

[aweary]

Sorry, I deleted my comment that @ummahusla was responding to.

toString would have been defined on a string, and he stated that it threw the same error with that. The issue was (partially) that message is an array and it he was passing in message.date instead of message[0].date

[ummahusla]

@Aweary Nah it's okay, it was my bad there. Didn't spot it at first and later on forgot to close the issue here.