Since this morning (CET), I have been experiencing a critical issue with my app, ShopFan, which is built on Bubble.io and wrapped using BDK Native.
Issue Description:
The app works fine on iPhones and Android devices.
However, on iPads, when opening the native app (which loads https://app.shopfan.io/mobile in a WebView), the screen stays black. I have loads of clients calling me because the app gives a black screen on iPads.
I inspected the issue using Safari’s Web Inspector and found that a CSS file is failing to load with a 400 error.
https://app.shopfan.io/package/run_css/a44635d587000506802db465e8554d6eafa9c50356e052c9298df9a9df722bbc/shopfan/live/mobile/xfalse/xfalse/reset.css.map
the answer is
{"error_class":"ClientError","args":{"code":"1742465332215x199013686289149400"},"message":"Invalid request: see error code for details"}
Additionally, there is a 404 error for a JavaScript source map file hosted on jsDelivr, but I assume this is not critical.
Troubleshooting Steps Taken
- I tested the same URL (/mobile) in Safari on iPad, and the same 400 error appears in the console.
- The issue does not occur on iPhones, suggesting it might be specific to WebKit on iPads or how Bubble serves CSS for certain devices.
- The iPad has not been updated recently, and no changes have been made to my Bubble app in the last few days.
- Clearing the cache and reinstalling the app did not solve the issue.
Questions for Bubble Support or the community
- Has Bubble made any changes to how CSS files are served?
- Are there known issues with WebView on iPads, especially with Safari 18.3?
- Is there a way to force a reload of CSS files or serve them differently?
This is a major issue for my users on iPads, and I would appreciate any guidance on how to resolve it as soon as possible.
Thank you for your help!