Troubleshooting: Widget Issues
Widget shows a blank iframe
Probable causes:
- Your JavaScript has an error that stops execution before any content renders.
- The widget is still loading data.
What to do:
- Open the Console tab in the widget editor. Look for red error messages.
- Check that your HTML has the elements your JavaScript references (matching
idattributes). - If the widget worked before and now shows blank, check whether the data connection was removed or its config was changed.
getData() returns undefined or errors
Probable causes:
- The connection name in your code doesn't match the name in the Data panel.
- The data connection isn't attached to the widget.
- The data source config isn't accessible to you.
What to do:
- Open the Data tab in the widget editor. Confirm the connection is listed.
- Check that the name you pass to
getData("name")matches exactly (case-sensitive). - If the connection uses a config you don't have access to, ask your admin to grant access.
getData() returns an empty array
Probable causes:
- The underlying table or query returned no records.
- Filters on the data connection are too restrictive.
What to do:
- Go to the data connection's detail page and review its filters.
- Try removing all filters temporarily to confirm the source has data.
- For SQL connections, test the query directly in your database tool to verify it returns results.
Console shows "Failed to fetch" or network errors
Probable causes:
- The data source config has incorrect credentials or the server is unreachable.
- A SQL or MQTT server is behind a firewall that blocks the Crow's Nest worker.
What to do:
- Ask your admin to test the data source config in Organization Settings.
- For SQL connections, verify the database server allows connections from Cloudflare Workers IP ranges.
- For MQTT, confirm the broker URL uses WebSocket protocol (
ws://orwss://).
Widget works in editor but not on a dashboard
Probable causes:
- The widget relies on a connection that the dashboard viewer doesn't have access to.
- Dashboard input values aren't being passed correctly.
What to do:
- Check that the dashboard viewer's role gives them access to the required data source configs.
- If the widget uses
getValue(), confirm that the dashboard has input defaults set for those keys. - Open the widget in the editor directly to confirm it still works independently.
Chart doesn't render
Probable causes:
- Chart.js code is in the wrong tab (should be in the Chart.js sub-tab, not the JavaScript tab).
- A variable referenced in the Chart.js section isn't defined in the JavaScript section.
What to do:
- Move chart creation code to the Chart.js sub-tab. This section runs after the JavaScript section and shares its scope.
- Make sure any data variables you reference in Chart.js are defined with
letorvar(notconstinside a block) in the JavaScript section so they're accessible. - Check the Console tab for Chart.js-specific errors.
Widget loads slowly
Probable causes:
- The data connection fetches a large number of records.
- Caching is disabled on a Tulip connection.
What to do:
- If using a Tulip connection, enable caching to avoid fetching all records on every load.
- Add filters to your data connection to reduce the record count.
- For SQL connections, optimize your query (add WHERE clauses, LIMIT, or indexes).
Need more help?
If none of the above resolves your issue, use the Feedback page (accessible from the navigation bar) to submit a bug report with details about what you see.