Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(bcd): use Safari icon for iOS WebView #12214

Merged
merged 5 commits into from
Nov 29, 2024
Merged

Conversation

foxypiratecove37350
Copy link
Contributor

Summary

Update the browserToIconName() function in client/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, the webview.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 added browserEnd 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

Browser compatibility table header's icons before

After

Browser compatibility table header's icons after

Update the `browserToIconName()` function in `client/src/document/ingredients/browser-compatibility-table/headers.tsx` to handle that edge case.
@foxypiratecove37350 foxypiratecove37350 requested a review from a team as a code owner November 29, 2024 14:53
@caugner caugner changed the title Fix iOS WebView showing the Android icon instead of the Safari icon fix(bcd): use Safari icon for iOS WebView Nov 29, 2024
Copy link
Contributor

@caugner caugner left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM, thank you.

Verified locally.

@caugner caugner enabled auto-merge (squash) November 29, 2024 16:50
@caugner caugner merged commit f800c24 into mdn:main Nov 29, 2024
13 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants