As the title says...
This is a userAgent in Safari (MacOS):
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/15.1 Safari/605.1.15
and then here is the same in Chrome (MacOS):
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/114.0.0.0 Safari/537.36
How am I supposed to tell which is which browser?
An escape route I found is window.chrome vs. window.safari as these are only defined in their own browser as the name suggests.
If anyone knows a somewhat more reliable or more detailed method to check these please let me know. :)
The point isn't to differentiate by name, because new browsers can pop up any time. You're supposed to test functionality before using it, and to write most (if not all) of your page in a cross-browser way. You can use polyfills or libraries like jQuery and let them figure out how to fill in the blanks.