Chart.js Integration Crashes with Rapid State Changes in Alpine.js 3.x #4291
Replies: 2 comments
-
Not sure if it's the root cause but you are sending http requests at every change without any guarantee that your responses will arrive in the right order. If you change it rapidly, the first request could in theory take longer then the second one leaving your component in an inconsistent state. You should consider disabling the input until you receive the data back or code some logic so only the latest request will update the component. |
Beta Was this translation helpful? Give feedback.
-
Seems like you should not be creating a new chartjs every time you update. You should be telling the current instance to use the new data. |
Beta Was this translation helpful? Give feedback.
-
Description:
When using Alpine.js with Chart.js, an error occurs intermittently while filtering data by time range. The error, Uncaught TypeError: Cannot read properties of null (reading 'save'), happens especially when changing filters too quickly or when selecting predefined time ranges such as 'today,' 'thisMonth,' 'thisYear,' etc. The issue is not present in Chart.js version 2.x, where filters could be changed rapidly without problems.
Steps to Reproduce:
Expected Behavior:
The charts should update smoothly with the new data without encountering any errors.
Actual Behavior:
The following error occurs intermittently:
Code Snippet:
Beta Was this translation helpful? Give feedback.
All reactions