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.

Sign up for GitHub

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

suport safari #569

Merged
merged 3 commits into from
Oct 1, 2024
Merged

suport safari #569

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
8067964
add information for safari update
meganrm Oct 1, 2024
3457053
tweaks based on comments
meganrm Oct 1, 2024
f210e85
match order of browsers
meganrm Oct 1, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
17 changes: 10 additions & 7 deletions src/components/TutorialPage/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -283,17 +283,20 @@ const TutorialPage = (): JSX.Element => {
<h1 id="browser-support">Browser support</h1>
<ul>
<li>
Currently, Simularium supports Firefox, Chrome, and
Edge. Some features may not work on other browsers.
Currently, Simularium supports Firefox, Safari,
Chrome, and Edge. Some features may not work on
Copy link

Choose a reason for hiding this comment

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

Super nit: Does the ordering of the browsers matter at all here? If this was ordered by popularity, it would be Chrome -> Safari -> Edge -> Firefox. Could do it alphabetically too.

other browsers.
</li>
<li>
If using Safari on a Mac, please enable WebGL 2.0 by
choosing Develop &gt; Experimental Features and
enabling &quot;WebGL 2.0&quot; (If you do not have a
Develop menu in your menu bar, please first choose
If using Safari on a Mac and it is not working,
Copy link

Choose a reason for hiding this comment

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

Nit: This reads weirdly to me. I'd add something like "If you are using Safari on a Mac and it is not working the content below is not loading", or whatever the expected issue would be.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

@toloudis do you know what the behavior would be if webGl isn't enabled? do they get an error message or is the viewer blank?

Copy link
Contributor

Choose a reason for hiding this comment

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

We have a webgl1 fallback from webgl2, but if they don't have WebGL at all that's a huge problem. I have no idea what happens then. I think even webgl2 is supported on well over 90% of devices by now.

update your browser to the most recent version. If
you are using an older version, please enable WebGL
meganrm marked this conversation as resolved.
Show resolved Hide resolved
2.0 by choosing Develop &gt; Experimental Features
and enabling &quot;WebGL 2.0&quot; (If you do not
have a Develop menu in your menu bar, first choose
Safari &gt; Preferences &gt; Advanced and enable
&quot;Show Develop menu in menu bar&quot;.) Then
please reload the viewer.
reload the viewer.
Copy link
Contributor Author

Choose a reason for hiding this comment

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

There were too many 'pleases' in this for me when I read it over, but I can add it back.

Copy link

Choose a reason for hiding this comment

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

I wouldn't say "please" at all tbh. The fewer words the better.

Copy link
Contributor

Choose a reason for hiding this comment

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

I agree, please remove all the instances of the word please. Pretty please with sugar on top.

I wonder if we can link people to Apple to get full instructions on how to enable WebGL2 on older safari.

</li>
</ul>
</div>
Expand Down
4 changes: 3 additions & 1 deletion src/containers/ViewerPanel/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -150,13 +150,15 @@ class ViewerPanel extends React.Component<ViewerPanelProps, ViewerPanelState> {
firefox: ">=51",
chrome: ">=56",
edge: ">=79",
safari: ">=15",
});
if (!isBrowserSupported) {
Modal.info({
title: "The browser you are using is not supported.",
content: (
<p>
Please use Firefox, Chrome, or Edge. See more details{" "}
Please use Firefox, Safari, Chrome, or Edge. See more
details{" "}
<a href={`${TUTORIAL_PATHNAME}#browser-support`}>
here
</a>{" "}
Expand Down
Loading