ITADN

[toast] using $.toast() instead of $('body').toast() results in infinite JS setTimeout loop

#3421Openbirkenfeld 创建于 2025-12-20
type/bug
B
birkenfeldcommented
# Bug Report The call on [this line](https://github.com/fomantic/Fomantic-UI/blob/0b6dfcbf0b6335ec0784cd4e3696b9c7701ade63/src/definitions/modules/toast.js#L23) within the toast implementation, if called as `$.toast()`, leads to an infinite loop of `setTimeout` invocations within jQuery code, as the `this` passed here is apparently detected as a function and therefore jQuery treats it like a `$(document).ready()` call. The toast still shows up, so initially the bug is invisible, only to be seen in increased CPU load especially when creating many toasts while the page is open. Calling `$('body').toast()` works as expected without side effects. ## Steps to reproduce 1. Include jQuery and fomantic-ui JS in a page. 2. Call `$.toast()` as directed on https://fomantic-ui.com/modules/toast.html 3. Observe increased CPU load of browser process. In the web developer tools, clicking the JS debugger "break" button will immediately break on some code in jQuery, the stack trace shows a large amount of setTimeout executions on the call stack. This can be observed in the minimal test case provided below, but also on the offical docs page (https://fomantic-ui.com/modules/toast.html). ## Expected result Toast pops up. ## Actual result Toast pops up and an infinite JS setTimeout loop runs in the background. ## Testcase ```html <!DOCTYPE html> <html> <head> <script src="https://cdn.jsdelivr.net/npm/jquery@3.7.1/dist/jquery.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/fomantic-ui@2.9.4/dist/semantic.min.js"></script> </head> <body> <button onclick="$.toast({message: 'Bug triggered'})">Click me</button> </body> </html> ``` ## Screenshots From debugger: <img width="738" height="708" alt="Image" src="https://github.com/user-attachments/assets/4eb91107-000b-4229-af7c-32052c43e1ca" /> ## Version fomantic-ui: 2.9.4 jquery: 3.7.1
0 条评论