-
-
Notifications
You must be signed in to change notification settings - Fork 699
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
Programmatically dismissed toasts while container is unmounted still appear when the container is mounted #811
Comments
Hey @trylle, thanks for opening the issue. I never thought about this use case before :). Regarding your PR, it's more a feature than a bug 😆. |
Thanks for the quick response, @fkhadra. 🙂 I agree it's a bit of a edge case. In our case it did seem like a bug, because we had an unclosable toast (a load indicator) which would sometimes be initiated and dismissed programmatically before the toast container was mounted, and the toast was then left in a stuck/unusable state cluttering the user's view. Our toast container was in a different part of the component tree from that which triggered the toast, so that exacerbated the issue. |
<p>This PR was automatically created by Snyk using the credentials of a real user.</p><br /><h3>Snyk has created this PR to upgrade react-toastify from 9.0.7 to 9.1.3.</h3> :information_source: Keep your dependencies up-to-date. This makes it easier to fix existing vulnerabilities and to more quickly identify and fix newly disclosed vulnerabilities when they affect your project. <hr/> - The recommended version is **6 versions** ahead of your current version. - The recommended version was released **25 days ago**, on 2023-05-14. <details> <summary><b>Release notes</b></summary> <br/> <details> <summary>Package name: <b>react-toastify</b></summary> <ul> <li> <b>9.1.3</b> - <a href="https://snyk.io/redirect/github/fkhadra/react-toastify/releases/tag/v9.1.3">2023-05-14</a></br><h1>Release note</h1> <ul> <li>Add support for RSC (next app router): <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="1695199612" data-permission-text="Title is private" data-url="fkhadra/react-toastify#951" data-hovercard-type="issue" data-hovercard-url="/fkhadra/react-toastify/issues/951/hovercard" href="https://snyk.io/redirect/github/fkhadra/react-toastify/issues/951">#951</a></li> <li>Partially address <code>Toast is undefined || Uncaught TypeError: Cannot read properties of undefined (reading 'content')</code> <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="1412605274" data-permission-text="Title is private" data-url="fkhadra/react-toastify#858" data-hovercard-type="issue" data-hovercard-url="/fkhadra/react-toastify/issues/858/hovercard" href="https://snyk.io/redirect/github/fkhadra/react-toastify/issues/858">#858</a> <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="1696250675" data-permission-text="Title is private" data-url="fkhadra/react-toastify#952" data-hovercard-type="issue" data-hovercard-url="/fkhadra/react-toastify/issues/952/hovercard" href="https://snyk.io/redirect/github/fkhadra/react-toastify/issues/952">#952</a></li> <li>Bump dependencies</li> </ul> </li> <li> <b>9.1.2</b> - <a href="https://snyk.io/redirect/github/fkhadra/react-toastify/releases/tag/v9.1.2">2023-03-21</a></br><h1>Release notes</h1> <p>Mainly bug fixes as I'm working on the next major release.</p> <h2><g-emoji class="g-emoji" alias="spider" fallback-src="https://github.githubassets.com/images/icons/emoji/unicode/1f577.png">🕷</g-emoji>Bugfixes</h2> <ul> <li>fix resetting options <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="1605117353" data-permission-text="Title is private" data-url="fkhadra/react-toastify#921" data-hovercard-type="issue" data-hovercard-url="/fkhadra/react-toastify/issues/921/hovercard" href="https://snyk.io/redirect/github/fkhadra/react-toastify/issues/921">#921</a> <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="1605073557" data-permission-text="Title is private" data-url="fkhadra/react-toastify#920" data-hovercard-type="issue" data-hovercard-url="/fkhadra/react-toastify/issues/920/hovercard" href="https://snyk.io/redirect/github/fkhadra/react-toastify/issues/920">#920</a></li> <li>fix autoClose on update <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="1593223965" data-permission-text="Title is private" data-url="fkhadra/react-toastify#918" data-hovercard-type="issue" data-hovercard-url="/fkhadra/react-toastify/issues/918/hovercard" href="https://snyk.io/redirect/github/fkhadra/react-toastify/issues/918">#918</a></li> <li>fix invalid CSS translate <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="1619151175" data-permission-text="Title is private" data-url="fkhadra/react-toastify#925" data-hovercard-type="issue" data-hovercard-url="/fkhadra/react-toastify/issues/925/hovercard" href="https://snyk.io/redirect/github/fkhadra/react-toastify/issues/925">#925</a></li> </ul> </li> <li> <b>9.1.2-rsc</b> - 2023-05-14 </li> <li> <b>9.1.1</b> - <a href="https://snyk.io/redirect/github/fkhadra/react-toastify/releases/tag/v9.1.1">2022-11-02</a></br><p>9.1.1</p> </li> <li> <b>9.1.0</b> - <a href="https://snyk.io/redirect/github/fkhadra/react-toastify/releases/tag/v9.1.0">2022-11-01</a></br><h1>Release notes</h1> <h2><g-emoji class="g-emoji" alias="rocket" fallback-src="https://github.githubassets.com/images/icons/emoji/unicode/1f680.png">🚀</g-emoji> Features</h2> <ul> <li><code>toast.promise</code> let you type <code>data</code> for each state. This is useful when rendering something based on the response.</li> </ul> <p>For example:</p> <div class="highlight highlight-source-tsx notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="interface Success { username: string } interface Error { err: string } toast.promise<Success,Error>(myPromise, { success: { render({ data }) { return data.username; } }, error: { render({ data }) { return data.err; } } }) "><pre><span class="pl-k">interface</span> <span class="pl-smi">Success</span> <span class="pl-kos">{</span> <span class="pl-c1">username</span>: <span class="pl-smi">string</span> <span class="pl-kos">}</span> <span class="pl-k">interface</span> <span class="pl-smi">Error</span> <span class="pl-kos">{</span> <span class="pl-c1">err</span>: <span class="pl-smi">string</span> <span class="pl-kos">}</span> <span class="pl-s1">toast</span><span class="pl-kos">.</span><span class="pl-en">promise</span><span class="pl-kos"><</span><span class="pl-smi">Success</span><span class="pl-kos">,</span><span class="pl-smi">Error</span><span class="pl-kos">></span><span class="pl-kos">(</span><span class="pl-s1">myPromise</span><span class="pl-kos">,</span> <span class="pl-kos">{</span> <span class="pl-c1">success</span>: <span class="pl-kos">{</span> <span class="pl-en">render</span><span class="pl-kos">(</span><span class="pl-kos">{</span> data <span class="pl-kos">}</span><span class="pl-kos">)</span> <span class="pl-kos">{</span> <span class="pl-k">return</span> <span class="pl-s1">data</span><span class="pl-kos">.</span><span class="pl-c1">username</span><span class="pl-kos">;</span> <span class="pl-kos">}</span> <span class="pl-kos">}</span><span class="pl-kos">,</span> <span class="pl-c1">error</span>: <span class="pl-kos">{</span> <span class="pl-en">render</span><span class="pl-kos">(</span><span class="pl-kos">{</span> data <span class="pl-kos">}</span><span class="pl-kos">)</span> <span class="pl-kos">{</span> <span class="pl-k">return</span> <span class="pl-s1">data</span><span class="pl-kos">.</span><span class="pl-c1">err</span><span class="pl-kos">;</span> <span class="pl-kos">}</span> <span class="pl-kos">}</span> <span class="pl-kos">}</span><span class="pl-kos">)</span></pre></div> <ul> <li><code>toast.update</code> accepts a generic as well to specify the data type</li> </ul> <div class="highlight highlight-source-tsx notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="interface TData { username: string } toast.update<TData>(id, { data: payload, render({ data }) { return `hello ${data.username}` } })"><pre><span class="pl-k">interface</span> <span class="pl-smi">TData</span> <span class="pl-kos">{</span> <span class="pl-c1">username</span>: <span class="pl-smi">string</span> <span class="pl-kos">}</span> <span class="pl-s1">toast</span><span class="pl-kos">.</span><span class="pl-en">update</span><span class="pl-kos"><</span><span class="pl-smi">TData</span><span class="pl-kos">></span><span class="pl-kos">(</span><span class="pl-s1">id</span><span class="pl-kos">,</span> <span class="pl-kos">{</span> <span class="pl-c1">data</span>: <span class="pl-s1">payload</span><span class="pl-kos">,</span> <span class="pl-en">render</span><span class="pl-kos">(</span><span class="pl-kos">{</span> data <span class="pl-kos">}</span><span class="pl-kos">)</span> <span class="pl-kos">{</span> <span class="pl-k">return</span> <span class="pl-s">`hello <span class="pl-s1"><span class="pl-kos">${</span><span class="pl-s1">data</span><span class="pl-kos">.</span><span class="pl-c1">username</span><span class="pl-kos">}</span></span>`</span> <span class="pl-kos">}</span> <span class="pl-kos">}</span><span class="pl-kos">)</span></pre></div> <h2><g-emoji class="g-emoji" alias="spider" fallback-src="https://github.githubassets.com/images/icons/emoji/unicode/1f577.png">🕷</g-emoji> Bugfixes</h2> <ul> <li>fix progress countdown stops on mobile <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="831649103" data-permission-text="Title is private" data-url="fkhadra/react-toastify#580" data-hovercard-type="issue" data-hovercard-url="/fkhadra/react-toastify/issues/580/hovercard" href="https://snyk.io/redirect/github/fkhadra/react-toastify/issues/580">#580</a></li> <li>prevent clash with ios native gesture <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="511805272" data-permission-text="Title is private" data-url="fkhadra/react-toastify#397" data-hovercard-type="issue" data-hovercard-url="/fkhadra/react-toastify/issues/397/hovercard" href="https://snyk.io/redirect/github/fkhadra/react-toastify/issues/397">#397</a></li> <li>fix toast when a word is too long <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="1425266300" data-permission-text="Title is private" data-url="fkhadra/react-toastify#864" data-hovercard-type="pull_request" data-hovercard-url="/fkhadra/react-toastify/pull/864/hovercard" href="https://snyk.io/redirect/github/fkhadra/react-toastify/pull/864">#864</a></li> <li>fix missing types declarations in exports <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="1384747418" data-permission-text="Title is private" data-url="fkhadra/react-toastify#843" data-hovercard-type="issue" data-hovercard-url="/fkhadra/react-toastify/issues/843/hovercard" href="https://snyk.io/redirect/github/fkhadra/react-toastify/issues/843">#843</a></li> <li>fix <code>toast.done</code> not dismissing toast <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="1403104391" data-permission-text="Title is private" data-url="fkhadra/react-toastify#853" data-hovercard-type="issue" data-hovercard-url="/fkhadra/react-toastify/issues/853/hovercard" href="https://snyk.io/redirect/github/fkhadra/react-toastify/issues/853">#853</a></li> <li>fix cursor when close on click is false <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="1374976459" data-permission-text="Title is private" data-url="fkhadra/react-toastify#839" data-hovercard-type="issue" data-hovercard-url="/fkhadra/react-toastify/issues/839/hovercard" href="https://snyk.io/redirect/github/fkhadra/react-toastify/issues/839">#839</a></li> </ul> <h2><g-emoji class="g-emoji" alias="rotating_light" fallback-src="https://github.githubassets.com/images/icons/emoji/unicode/1f6a8.png">🚨</g-emoji> Deprecated API</h2> <p>Added deprecation notice for the API below. They will be removed in the next major release</p> <table> <thead> <tr> <th>API</th> <th>Why</th> <th>Alternative</th> </tr> </thead> <tbody> <tr> <td><code>onClick</code></td> <td>Not used that much, it's increasing the API surface for nothing</td> <td>Can easily be implemented in userland. Just render a react component and attach the handler to it. <code>toast(<div onClick={doSomething}>hello</div>)</code></td> </tr> <tr> <td><code>onOpen</code></td> <td>Does not play well with <code>useEffect</code> behavior in react18 (runs twice in dev mode) see <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="1205306489" data-permission-text="Title is private" data-url="fkhadra/react-toastify#741" data-hovercard-type="issue" data-hovercard-url="/fkhadra/react-toastify/issues/741/hovercard" href="https://snyk.io/redirect/github/fkhadra/react-toastify/issues/741">#741</a></td> <td>A better approach is to use <code>toast.onChange</code> see <a href="https://fkhadra.github.io/react-toastify/listen-for-changes/" rel="nofollow">https://fkhadra.github.io/react-toastify/listen-for-changes/</a></td> </tr> <tr> <td><code>onClose</code></td> <td>Does not play well with <code>useEffect</code> behavior in react18 (runs twice in dev mode) see <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="1205306489" data-permission-text="Title is private" data-url="fkhadra/react-toastify#741" data-hovercard-type="issue" data-hovercard-url="/fkhadra/react-toastify/issues/741/hovercard" href="https://snyk.io/redirect/github/fkhadra/react-toastify/issues/741">#741</a></td> <td>A better approach is to use <code>toast.onChange</code> see <a href="https://fkhadra.github.io/react-toastify/listen-for-changes/" rel="nofollow">https://fkhadra.github.io/react-toastify/listen-for-changes/</a></td> </tr> <tr> <td><code>toast.POSITION</code></td> <td>Reduce bundle size :)</td> <td>Thanks to typescript, we now have autocomplete</td> </tr> <tr> <td><code>toast.TYPE</code></td> <td>Reduce bundle size :)</td> <td>Thanks to typescript, we now have autocomplete</td> </tr> </tbody> </table> <h2><g-emoji class="g-emoji" alias="gear" fallback-src="https://github.githubassets.com/images/icons/emoji/unicode/2699.png">⚙️</g-emoji> Chore</h2> <ul> <li>bump dependencies</li> <li>refactor internal</li> </ul> </li> <li> <b>9.0.8</b> - <a href="https://snyk.io/redirect/github/fkhadra/react-toastify/releases/tag/v9.0.8">2022-08-07</a></br><h1>Release notes</h1> <h2><g-emoji class="g-emoji" alias="lady_beetle" fallback-src="https://github.githubassets.com/images/icons/emoji/unicode/1f41e.png">🐞</g-emoji>Bugfixes</h2> <ul> <li>fix draggable in strict mode <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="1228656148" data-permission-text="Title is private" data-url="fkhadra/react-toastify#752" data-hovercard-type="issue" data-hovercard-url="/fkhadra/react-toastify/issues/752/hovercard" href="https://snyk.io/redirect/github/fkhadra/react-toastify/issues/752">#752</a></li> <li>fix sass import <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="1255286931" data-permission-text="Title is private" data-url="fkhadra/react-toastify#771" data-hovercard-type="issue" data-hovercard-url="/fkhadra/react-toastify/issues/771/hovercard" href="https://snyk.io/redirect/github/fkhadra/react-toastify/issues/771">#771</a></li> <li>fix progress bar overflow for WebKit browser(safari, ios...) <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="1299896074" data-permission-text="Title is private" data-url="fkhadra/react-toastify#791" data-hovercard-type="issue" data-hovercard-url="/fkhadra/react-toastify/issues/791/hovercard" href="https://snyk.io/redirect/github/fkhadra/react-toastify/issues/791">#791</a></li> <li>fix dismissed toasts while the container is unmounted still appear when the container is mounted <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="1327813083" data-permission-text="Title is private" data-url="fkhadra/react-toastify#811" data-hovercard-type="issue" data-hovercard-url="/fkhadra/react-toastify/issues/811/hovercard" href="https://snyk.io/redirect/github/fkhadra/react-toastify/issues/811">#811</a></li> <li>fix AutoClose doesn't work on update <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="1326132465" data-permission-text="Title is private" data-url="fkhadra/react-toastify#810" data-hovercard-type="issue" data-hovercard-url="/fkhadra/react-toastify/issues/810/hovercard" href="https://snyk.io/redirect/github/fkhadra/react-toastify/issues/810">#810</a> <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="1282846074" data-permission-text="Title is private" data-url="fkhadra/react-toastify#782" data-hovercard-type="issue" data-hovercard-url="/fkhadra/react-toastify/issues/782/hovercard" href="https://snyk.io/redirect/github/fkhadra/react-toastify/issues/782">#782</a> <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="1156837912" data-permission-text="Title is private" data-url="fkhadra/react-toastify#720" data-hovercard-type="issue" data-hovercard-url="/fkhadra/react-toastify/issues/720/hovercard" href="https://snyk.io/redirect/github/fkhadra/react-toastify/issues/720">#720</a></li> </ul> <h2>Chore</h2> <ul> <li>master branch renamed to main <g-emoji class="g-emoji" alias="sparkling_heart" fallback-src="https://github.githubassets.com/images/icons/emoji/unicode/1f496.png">💖</g-emoji></li> </ul> </li> <li> <b>9.0.7</b> - <a href="https://snyk.io/redirect/github/fkhadra/react-toastify/releases/tag/v9.0.7">2022-07-19</a></br><h1>Release note</h1> <h2>Bugfix</h2> <ul> <li>fix memory leak when multiple containers are used <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="1259604572" data-permission-text="Title is private" data-url="fkhadra/react-toastify#772" data-hovercard-type="issue" data-hovercard-url="/fkhadra/react-toastify/issues/772/hovercard" href="https://snyk.io/redirect/github/fkhadra/react-toastify/issues/772">#772</a>, thanks to <a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/roblotter/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://snyk.io/redirect/github/roblotter">@ roblotter</a></li> </ul> <h2>Chore</h2> <ul> <li>build artifacts are no longer minified. This was causing issues with some bundlers like vitejs <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="1307006946" data-permission-text="Title is private" data-url="fkhadra/react-toastify#797" data-hovercard-type="issue" data-hovercard-url="/fkhadra/react-toastify/issues/797/hovercard" href="https://snyk.io/redirect/github/fkhadra/react-toastify/issues/797">#797</a></li> </ul> </li> </ul> from <a href="https://snyk.io/redirect/github/fkhadra/react-toastify/releases">react-toastify GitHub release notes</a> </details> </details> <details> <summary><b>Commit messages</b></summary> </br> <details> <summary>Package name: <b>react-toastify</b></summary> <ul> <li><a href="https://snyk.io/redirect/github/fkhadra/react-toastify/commit/94a36ff04e1cc8de6b2aa588e207a47ba1188d39">94a36ff</a> 9.1.3</li> <li><a href="https://snyk.io/redirect/github/fkhadra/react-toastify/commit/f0e64cc4da0db8385401a47e11eb96c016682f7d">f0e64cc</a> partial fix #858 #952</li> <li><a href="https://snyk.io/redirect/github/fkhadra/react-toastify/commit/74b320ad627d42fed5f6646477daede117db69d2">74b320a</a> add use client to generated output</li> <li><a href="https://snyk.io/redirect/github/fkhadra/react-toastify/commit/0edd49a250248343263b917db3dbc26bd2c2d2b3">0edd49a</a> bump deps</li> <li><a href="https://snyk.io/redirect/github/fkhadra/react-toastify/commit/bbe05c78e430fa0075a297fcf7201c6b8774bf23">bbe05c7</a> output type first</li> <li><a href="https://snyk.io/redirect/github/fkhadra/react-toastify/commit/277deee6a3fc6b709e3a81971adfa2040cf24942">277deee</a> Update CONTRIBUTING.md</li> <li><a href="https://snyk.io/redirect/github/fkhadra/react-toastify/commit/378afe67ea67a08673a1539c20eae358febc39cb">378afe6</a> Move `types` condition to the front of the `addons/use-notification-center` entry</li> <li><a href="https://snyk.io/redirect/github/fkhadra/react-toastify/commit/97d9afc48c6e2ef0f6240842700251b8b6e64cd9">97d9afc</a> update copyright year</li> <li><a href="https://snyk.io/redirect/github/fkhadra/react-toastify/commit/321a3455ab74a84a6719335db601e72ecc16c2b0">321a345</a> 9.1.2</li> <li><a href="https://snyk.io/redirect/github/fkhadra/react-toastify/commit/12cbc6984d83f1f2c08bdb773442da9c1f0f645d">12cbc69</a> (chore): change type prop to optional</li> <li><a href="https://snyk.io/redirect/github/fkhadra/react-toastify/commit/100044d8e4677ca524a4966afbca3265e53c67bb">100044d</a> fix invalid translate #925</li> <li><a href="https://snyk.io/redirect/github/fkhadra/react-toastify/commit/fb7126ab64c06a7b7dac043f9e30dffd7278c432">fb7126a</a> fix autoClose doesn't work on update #918</li> <li><a href="https://snyk.io/redirect/github/fkhadra/react-toastify/commit/11888ce7e5a62743434de216c2be3a68bb7ba8a1">11888ce</a> fix resetting options #921 #920</li> <li><a href="https://snyk.io/redirect/github/fkhadra/react-toastify/commit/eca19e9066c92a9ab102532f85e04aebd9a1e0c7">eca19e9</a> chore: bump dependencies</li> <li><a href="https://snyk.io/redirect/github/fkhadra/react-toastify/commit/eb407af221242df2e39742d5acd0f7a4e7f77872">eb407af</a> 9.1.1</li> <li><a href="https://snyk.io/redirect/github/fkhadra/react-toastify/commit/80bf024d2f72fe6ac55a437ae334f3e8393ec59f">80bf024</a> fix style not applied properly #870</li> <li><a href="https://snyk.io/redirect/github/fkhadra/react-toastify/commit/e5074908afaafe78ce609562cfffbd5990897de6">e507490</a> 9.1.0</li> <li><a href="https://snyk.io/redirect/github/fkhadra/react-toastify/commit/e8cac357c0ceaf45436d10bc83c71a8ba6225410">e8cac35</a> allow to specify TData for update</li> <li><a href="https://snyk.io/redirect/github/fkhadra/react-toastify/commit/f33823df3342057b60b513aefa0473f07729de3f">f33823d</a> clean a bit</li> <li><a href="https://snyk.io/redirect/github/fkhadra/react-toastify/commit/80fab3c163a9140477d6c4452819da041f58c648">80fab3c</a> deprecate onClick</li> <li><a href="https://snyk.io/redirect/github/fkhadra/react-toastify/commit/3afe7efcb3c8bba8776934ee1ba193d4b1b1ce3b">3afe7ef</a> remove isNil util</li> <li><a href="https://snyk.io/redirect/github/fkhadra/react-toastify/commit/54e397af872ff69476098b4ddd17897c499b53d1">54e397a</a> remove excessive validation</li> <li><a href="https://snyk.io/redirect/github/fkhadra/react-toastify/commit/4952d948ec8647a705ec905074c51e2559f4f77f">4952d94</a> Revert "alias requestAnimationFrame"</li> <li><a href="https://snyk.io/redirect/github/fkhadra/react-toastify/commit/498c1694b9fb0fa74686cdd75f3c02e8b571b426">498c169</a> shorten declaration</li> </ul> <a href="https://snyk.io/redirect/github/fkhadra/react-toastify/compare/307e78bdd92151709bfc16de1cfcee91e54dab92...94a36ff04e1cc8de6b2aa588e207a47ba1188d39">Compare</a> </details> </details> <hr/> **Note:** *You are seeing this because you or someone else with access to this repository has authorized Snyk to open upgrade PRs.* For more information: <img src="https://api.segment.io/v1/pixel/track?data=eyJ3cml0ZUtleSI6InJyWmxZcEdHY2RyTHZsb0lYd0dUcVg4WkFRTnNCOUEwIiwiYW5vbnltb3VzSWQiOiIxZGI1ZDdkMS1lZDMyLTRiMDUtODRjMC0zOGE1NjRhNzcyNjkiLCJldmVudCI6IlBSIHZpZXdlZCIsInByb3BlcnRpZXMiOnsicHJJZCI6IjFkYjVkN2QxLWVkMzItNGIwNS04NGMwLTM4YTU2NGE3NzI2OSJ9fQ==" width="0" height="0"/> 🧐 [View latest project report](https://app.snyk.io/org/mtes-mct/project/afb3e19a-88e3-4a0e-9409-d0f9cfdc75b5?utm_source=github&utm_medium=referral&page=upgrade-pr) 🛠 [Adjust upgrade PR settings](https://app.snyk.io/org/mtes-mct/project/afb3e19a-88e3-4a0e-9409-d0f9cfdc75b5/settings/integration?utm_source=github&utm_medium=referral&page=upgrade-pr) 🔕 [Ignore this dependency or unsubscribe from future upgrade PRs](https://app.snyk.io/org/mtes-mct/project/afb3e19a-88e3-4a0e-9409-d0f9cfdc75b5/settings/integration?pkg=react-toastify&utm_source=github&utm_medium=referral&page=upgrade-pr#auto-dep-upgrades) <!--- (snyk:metadata:{"prId":"1db5d7d1-ed32-4b05-84c0-38a564a77269","prPublicId":"1db5d7d1-ed32-4b05-84c0-38a564a77269","dependencies":[{"name":"react-toastify","from":"9.0.7","to":"9.1.3"}],"packageManager":"npm","type":"auto","projectUrl":"https://app.snyk.io/org/mtes-mct/project/afb3e19a-88e3-4a0e-9409-d0f9cfdc75b5?utm_source=github&utm_medium=referral&page=upgrade-pr","projectPublicId":"afb3e19a-88e3-4a0e-9409-d0f9cfdc75b5","env":"prod","prType":"upgrade","vulns":[],"issuesToFix":[],"upgrade":[],"upgradeInfo":{"versionsDiff":6,"publishedDate":"2023-05-14T18:56:17.373Z"},"templateVariants":[],"hasFixes":false,"isMajorUpgrade":false,"isBreakingChange":false,"priorityScoreList":[]}) --->
Do you want to request a feature or report a bug?
Bug
What is the current behavior?
Programmatically dismissing a toast while the container is unmounted has no effect. The toast still shows up when the container is mounted.
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:
https://codesandbox.io/s/dismiss-toast-bug-ykxptu
Add toast
buttonDismiss toast
buttonToggle container
button to mount containerWhat is the expected behavior?
Toast does not appear when the container is mounted.
Which versions of React, and which browser / OS are affected by this issue? Did this work in previous versions of React?
Tested on React 17.0.2, Firefox, Linux. I am not aware that it has ever worked.
The text was updated successfully, but these errors were encountered: