fix(bcd): use Safari icon for iOS WebView #12214
Merged
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Summary
Update the
browserToIconName()
function inclient/src/document/ingredients/browser-compatibility-table/headers.tsx
to handle the edge case of the iOS WebView, that shows the Android icon instead of the Safari icon (iOS WebView is Safari-based).Problem
Before, the icon was only the part before the
"_"
(with an edge case for the Firefox icon). Or, thewebview.svg
icon is the Android icon, for Android WebView, but since iOS WebView's name in the code is"webview_ios"
, the icon displayed for iOS WebView is the Android icon, while iOS WebView is Safari-based.Issue #12213
Solution
My solution is to add another case for when
browserStart
is"webview"
. I also addedbrowserEnd
since I needed it to differenciate between Android and iOS WebView, and refactored a bit to make it more scalable, in case of potential future expensions.Screenshots
Before
After