Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[bug] 'format.replace is not a function' when generating toastId #530

Closed
freezepl opened this issue Oct 2, 2020 · 1 comment · Fixed by #554, newerton/gobarber-frontend#11 or newerton/gostack-modulo07#17
Assignees
Labels
Merged in next Merged but not live

Comments

@freezepl
Copy link

freezepl commented Oct 2, 2020

Do you want to request a feature or report a bug?
BUG
What is the current behavior?
Toasts are not working. Error is displayed in the console:

application-db3a52d1d5b71b55aa2e77ebf69a742adc8e5f2bc68e97029c4d4a1ea315897d.js:20410 Uncaught TypeError: format.replace is not a function
    at Date.toString 
    at generateToastId (react-toastify.esm.js?146c:607)
    at getToastId (react-toastify.esm.js?146c:619)
    at mergeOptions (react-toastify.esm.js?146c:656)
    at toast (react-toastify.esm.js?146c:661)
    at notify (index.js?002b:19)
    at HTMLUnknownElement.callCallback (react-dom.development.js?61bb:188)
    at HTMLUnknownElement.fn.___hb (honeybadger.js?4072:767)
    at Object.invokeGuardedCallbackDev (react-dom.development.js?61bb:237)
    at invokeGuardedCallback (react-dom.development.js?61bb:292)

How to reproduce?
Paste the code of the method in the console:

(Math.random().toString(36) + Date.now().toString(36)).substr(2, 10);

application-db3a52d1d5b71b55aa2e77ebf69a742adc8e5f2bc68e97029c4d4a1ea315897d.js:20410 Uncaught TypeError: format.replace is not a function
    at Date.toString 
    at <anonymous>:1:42

I tried to change toString to toISOString and it worked:

(Math.random().toString(36) + Date.now().toISOString()).substr(2, 10);
"bv7a4q6eyc"

If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem. Your bug will get fixed much faster if we can run your code and it doesn't have dependencies other than React. Paste the link to your CodeSandbox (https://codesandbox.io/s/new) example below:
I used code from https://fkhadra.github.io/react-toastify/the-gist-of-react-toastify
What is the expected behavior?
It should display the toast
Which versions of React, and which browser / OS are affected by this issue? Did this work in previous versions of React?
React 16.11.0
Chrome Version 85.0.4183.121 (Official Build) (64-bit)

@fkhadra
Copy link
Owner

fkhadra commented Oct 3, 2020

Hello @freezepl,

Could you reproduce the bug and share a codesanbox thanks.

@fkhadra fkhadra self-assigned this Dec 20, 2020
@fkhadra fkhadra added Merged in next Merged but not live and removed Reproduction Needed labels Dec 23, 2020
fkhadra added a commit that referenced this issue Dec 29, 2020
@fkhadra fkhadra mentioned this issue Dec 29, 2020
fkhadra added a commit that referenced this issue Jan 25, 2021
## 💥 Breaking changes

- dependency to react-transition-group has been removed #514
- the `duration` parameter has been removed from `cssTransition`. Css animations just works now out of the box. Check the codesanbox below  
- the border-radius has been increased a bit

##  🚀 Features

- Css animation just works! 
[![View](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/react-toastify-animatecss-jxrx9?fontsize=14&hidenavigation=1&theme=dark&view=preview)

- add a way to load the CSS without a CSS loader
[![Edit react-toastify-inject-style](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/react-toastify-inject-style-qfg0l?fontsize=14&hidenavigation=1&theme=dark)
- specify swipe direction, close #512 . Thanks to @denydavy
[![Edit react-toastify-drag-y](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/react-toastify-drag-y-lh88i?fontsize=14&hidenavigation=1&theme=dark)
- bundle size reduced from ~7k to ~5k!
- remove the dependency on prop-types.

## 🐛 Bugfix

- fix #541 apply pauseOnFocusLoss on first render
- fix #538 react-dom should be a peer dep
- fix #530 change id generation
- fix #534 #483 toastId cannot be reused
- fix #511 by removing react-transition-group
- fix #550 Unable to select text inside inputs when a toast is open
- fix #555 The toast timer starts after you click on the toast
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Merged in next Merged but not live
Projects
None yet
2 participants