Open rajivpatki opened 2 weeks ago
To resolve the issue in Apache Superset version 3.1.3 where long dashboards render blank thumbnails, you can modify the DashboardCard
component to handle the thumbnail fetching more effectively. Specifically, ensure that the thumbnail URL is set correctly and that the fetching process is managed properly.
Here is the relevant part of the DashboardCard
component that deals with fetching and setting the thumbnail URL:
useEffect(() => {
// fetch thumbnail only if it's not already fetched
if (
!fetchingThumbnail &&
dashboard.id &&
(thumbnailUrl === undefined || thumbnailUrl === null) &&
isFeatureEnabled(FeatureFlag.Thumbnails)
) {
// fetch thumbnail
if (dashboard.thumbnail_url) {
// set to empty string if null so that we don't
// keep fetching the thumbnail
setThumbnailUrl(dashboard.thumbnail_url || '');
return;
}
setFetchingThumbnail(true);
SupersetClient.get({
endpoint: `/api/v1/dashboard/${dashboard.id}`,
}).then(({ json = {} }) => {
setThumbnailUrl(json.thumbnail_url || '');
setFetchingThumbnail(false);
});
}
}, [dashboard, thumbnailUrl]);
Ensure that the thumbnailUrl
is set to an empty string if the dashboard.thumbnail_url
is null. This prevents repeated fetching attempts which might be causing the issue with long dashboards [1].
Additionally, make sure that the cover
property in the ListViewCard
component is correctly set to handle the absence of thumbnails:
cover={
!isFeatureEnabled(FeatureFlag.Thumbnails) || !showThumbnails ? (
<></>
) : null
}
This ensures that the component does not attempt to render a thumbnail if the feature is disabled or if thumbnails are not to be shown [1].
By making these adjustments, you should be able to resolve the issue with blank thumbnails for long dashboards.
To continue talking to Dosu, mention @dosu.
@dosu
It's not that dashboard.thumbnail_url is null
, it's that the thumbnail does not have any charts when it is created unless the height of the dashboard is lower than a certain value
To address the issue where long dashboards render blank thumbnails in Apache Superset version 3.1.3, you can try the following steps:
Ensure Playwright is Properly Installed and Configured:
Make sure the playwright
package and its dependencies are correctly installed and configured in your Dockerfile:
FROM apache/superset:3.1.3
RUN pip install --no-cache-dir \
playwright \
&& playwright install-deps \
&& playwright install
Adjust Playwright Settings:
Increase the SCREENSHOT_PLAYWRIGHT_DEFAULT_TIMEOUT
to allow more time for rendering:
SCREENSHOT_PLAYWRIGHT_DEFAULT_TIMEOUT = int(timedelta(seconds=120).total_seconds() * 1000)
Simplify the Dashboard: Consider simplifying the dashboard by reducing the number of elements or using tabs to avoid rendering issues with long dashboards. This can help Playwright handle the rendering more effectively.
Modify the DashboardCard
Component:
Ensure the DashboardCard
component correctly handles the fetching and setting of the thumbnail URL:
useEffect(() => {
if (
!fetchingThumbnail &&
dashboard.id &&
(thumbnailUrl === undefined || thumbnailUrl === null) &&
isFeatureEnabled(FeatureFlag.Thumbnails)
) {
if (dashboard.thumbnail_url) {
setThumbnailUrl(dashboard.thumbnail_url || '');
return;
}
setFetchingThumbnail(true);
SupersetClient.get({
endpoint: `/api/v1/dashboard/${dashboard.id}`,
}).then(({ json = {} }) => {
setThumbnailUrl(json.thumbnail_url || '');
setFetchingThumbnail(false);
});
}
}, [dashboard, thumbnailUrl]);
Ensure Feature Flags are Enabled:
Verify that the THUMBNAILS
and PLAYWRIGHT_REPORTS_AND_THUMBNAILS
feature flags are enabled in your superset/config.py
file:
DEFAULT_FEATURE_FLAGS: dict[str, bool] = {
...
"THUMBNAILS": True,
"PLAYWRIGHT_REPORTS_AND_THUMBNAILS": True,
...
}
By following these steps, you should be able to resolve the issue with blank thumbnails for long dashboards [1][2].
To continue talking to Dosu, mention @dosu.
I seem to have narrowed down the element causing this. This issue occurs if there is a table with more than 100 rows of data on the dashboard. Limiting the output to 100 renders the thumbnail properly:
Enabling Pagination does not fix this. But Server-side pagination with 100 page length does.
Bug description
We have several dashboards that render their thumbnails properly. For some, Playwright would only render the background of the dashboard and not the charts (we have color backgrounds using CSS for some)
When I reduce the height of charts to fit them in less than 3 page down scrolls, the thumbnail works fine, but if the length exceeds a certain amount, a blank thumbnail is rendered.
How to reproduce the bug
Dockerfile:
The dashboard should render a blank thumbnail:![notfine](https://github.com/apache/superset/assets/54361216/f495f151-de4d-4e07-9d3e-770892bc8a9d)
Now remove rows from the dashboard to reduce its height or resize elements to fit them in a shorter height, the thumbnail is rendered fine:![fine](https://github.com/apache/superset/assets/54361216/2ada0983-916c-416c-8148-f5b53a19d412)
Screenshots/recordings
No response
Superset version
3.1.3
Python version
Not applicable
Node version
Not applicable
Browser
Not applicable
Additional context
No response
Checklist