UnhandledPromiseRejectionWarning: TypeError: Cannot read property 'TOP_LEFT' of undefined

[wwwennn]

Hi there,

Our project is recently upgraded to react16 but we found some errors caused by toast. If i comment out the code related to toast, everything works fine. The error message is as title describes. Could anyone help? We use react@16.4.1 and react-toastify@4.1.0.

[fkhadra]

Hello @wwwennn,

Could you share the code, please?

[jamesmbourne]

I have experienced a similar error which can be reproduced with

import { ToastType } from 'react-toastify';

describe('ToastType', () => {
  it('Has the expected string value', () => {
    expect(ToastType.ERROR).toEqual('error');
  });
});

This test case produces the error:

TypeError: Cannot read property 'ERROR' of undefined

This has occured using v4.3.0. I think this issue is described in https://lukasbehal.com/2017-05-22-enums-in-declaration-files/ - I don't think that enums in .d.ts files are actually compiled into the JS output by the TypeScript compiler.

[fkhadra]

Hey @jamesmbourne,

Indeed, they are not compiled. To sumup, I should replace the enum by type ?

I was using type instead of enum before the v4.3 but if you refer to this PR #221 , the type were causing bug.

EDIT: The test can be written as follow:

import { toast } from 'react-toastify';

describe('ToastType', () => {
  it('Has the expected string value', () => {
    expect(toast.TYPE.ERROR).toEqual('error');
  });
});

[jamesmbourne]

@fkhadra yes I believe that will be the best solution, without requiring a rewrite of the library in TS.

I've just put a PR in to revert the change from type to enum in #231. I have downgraded to v4.2.0 as a workaround and this seems to work both in terms of type and position for the toast.

[fkhadra]

@wwwennn error is not related to the typescript definition file.

We use react@16.4.1 and react-toastify@4.1.0.

The PR #221 has been published with the v4.2.0

Even if I revert the change from type to enum, this won't fix your issue for 2 reasons:

• Typescript type cannot be used as a value.
• Not sure for that one but, if I refer to your test, the code is written in pure js not in typescript right ?

I think that your issue is related to the test implementation. Like I suggested above, you should use toast instead of ToastType.

[jamesmbourne]

@fkhadra my mistake, as I was creating the issue it suggested this may be related due to the similar error messages but I didn't want to duplicate an existing issue.

On the second point, the code is indeed TypeScript. I was just using that to demonstrate how the compiled TS does not have a value for ToastType.ERROR, even though it passes compile-time checks.

You are correct in that the following test does indeed pass:

import { toast } from 'react-toastify';

describe('ToastType', () => {
  it('Has the expected string value', () => {
    expect(toast.TYPE.ERROR).toEqual('error');
  });
});

Perhaps a better solution would be to not export the enum ToastType and enum ToastPosition from the .index.d.ts, to make it easier to avoid this issue in the future. I will update my PR to reflect this.

[fkhadra]

Closing the issue since I'm not exporting enum anymore and provide ToastType and ToastPosition helper.