-
Notifications
You must be signed in to change notification settings - Fork 29
Description
Background
(Originally reported on the browserslist repo here: browserslist/browserslist#732)
We display a page to users who have an outdated browser according to our browserslist configuration. For this we use browserslist-useragent to match the user agent string against our list of supported browsers, then redirect to an "Outdated browser" page.
Description of the issue
Queries targeting minor versions of iOS Safari 10 are not recognised apart from 10.2. The non-recognised versions are treated as v10.0.0.
If I visit our web page using Safari 10.1.x, 10.2.x or 10.3.x when using the non-recognised queries I will be redirected to the "Outdated browser" page.
The following queries are not recognised:
ios_saf >= 10.1
ios_saf >= 10.3
Strangely, this query is recognised:
ios_saf >= 10.2
If I change the query to ios_saf >= 10 it work as expected, however I am unable to target minor versions as described above.
How to reproduce
https://runkit.com/camslice/ios-safari-10-minor-version-queries-not-recognised
const { matchesUA } = require('browserslist-useragent');
// user agent strings
const UA_ios_saf_10_1 = 'Mozilla/5.0 (iPhone; CPU iPhone OS 10_1 like Mac OS X) AppleWebKit/602.2.14 (KHTML, like Gecko) Version/10.0 Mobile/14B72 Safari/602.1';
const UA_ios_saf_10_3_1 = 'Mozilla/5.0 (iPhone; CPU iPhone OS 10_3_1 like Mac OS X) AppleWebKit/603.1.30 (KHTML, like Gecko) Version/10.0 Mobile/14E8301 Safari/602.1';
const UA_ios_saf_10_3_4 = 'Mozilla/5.0 (iPhone; CPU iPhone OS 10_3_4 like Mac OS X) AppleWebKit/603.3.8 (KHTML, like Gecko) Version/10.0 Mobile/14G61 Safari/602.1';
// only returns `true` for `ios_saf >= 10.2`
console.log(
'10_1 >= 10.1: ' + matchesUA(UA_ios_saf_10_1, { browsers: ['ios_saf >= 10.1'] }),
'10_3_1 >= 10.1: ' + matchesUA(UA_ios_saf_10_3_1, { browsers: ['ios_saf >= 10.1'] }),
'10_3_1 >= 10.2: ' + matchesUA(UA_ios_saf_10_3_1, { browsers: ['ios_saf >= 10.2'] }),
'10_3_1 >= 10.3: ' + matchesUA(UA_ios_saf_10_3_1, { browsers: ['ios_saf >= 10.3'] }),
'10_3_4 >= 10.1: ' + matchesUA(UA_ios_saf_10_3_4, { browsers: ['ios_saf >= 10.1'] }),
'10_3_4 >= 10.2: ' + matchesUA(UA_ios_saf_10_3_4, { browsers: ['ios_saf >= 10.2'] }),
'10_3_4 >= 10.3: ' + matchesUA(UA_ios_saf_10_3_4, { browsers: ['ios_saf >= 10.3'] }),
''
);
// returns `true` as expected
console.log(
'10_1 >= 10: ' + matchesUA(UA_ios_saf_10_1, { browsers: ['ios_saf >= 10'] }),
'10_3_1 >= 10: ' + matchesUA(UA_ios_saf_10_3_1, { browsers: ['ios_saf >= 10'] }),
'10_3_4 >= 10: ' + matchesUA(UA_ios_saf_10_3_4, { browsers: ['ios_saf >= 10'] }),
);