-
Notifications
You must be signed in to change notification settings - Fork 53
feat: support client hints #114
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
base: main
Are you sure you want to change the base?
Conversation
Any plans on getting this merged? |
@@ -135,7 +135,30 @@ export default function ({ $device }) { | |||
} | |||
``` | |||
|
|||
`clientHints.enabled` enables client hints feature.(default by false) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
`clientHints.enabled` enables client hints feature.(default by false) | |
`clientHints.enabled` enables client hints feature (false by default). |
😄
|
||
## User-Agent Client Hints Support | ||
|
||
To enable Client Hints, set clientHints.enabled options to true. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
To enable Client Hints, set clientHints.enabled options to true. | |
To enable Client Hints, set `clientHints.enabled` options to `true`. |
function deleteUndefinedProperties(obj) { | ||
for (const key of Object.keys(obj)) { | ||
if (typeof obj[key] === 'undefined') { | ||
delete obj[key] | ||
} | ||
} | ||
return obj | ||
} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
function deleteUndefinedProperties(obj) { | |
for (const key of Object.keys(obj)) { | |
if (typeof obj[key] === 'undefined') { | |
delete obj[key] | |
} | |
} | |
return obj | |
} | |
function deleteUndefinedProperties(obj) { | |
return Object.fromEntries( | |
Object.entries(obj).filter(([_, value]) => typeof value !== 'undefined') | |
) | |
} |
💅
const ios = undefined | ||
const android = undefined | ||
const windows = platform === 'Windows' | ||
const macOS = platform === 'macOS' | ||
const isSafari = undefined | ||
const isFirefox = undefined | ||
const isEdge = hasBrand('Microsoft Edge') | ||
const isChrome = hasBrand('Google Chrome') | ||
const isSamsung = undefined | ||
const isCrawler = undefined | ||
return deleteUndefinedProperties({ mobile, mobileOrTablet, ios, android, windows, macOS, isSafari, isFirefox, isEdge, isChrome, isSamsung, isCrawler }) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Why setting these to undefined
if we're deleting them right away ?
const brands = uaHeader.split(',').map(b => b.trim()).map(brandStr => { | ||
const parsed = brandStr.match(REGEX_CLIENT_HINT_BRAND) | ||
console.log(brandStr, parsed) | ||
return {brand: parsed[1], version: parsed[2]} | ||
}) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
const brands = uaHeader.split(',').map(b => b.trim()).map(brandStr => { | |
const parsed = brandStr.match(REGEX_CLIENT_HINT_BRAND) | |
console.log(brandStr, parsed) | |
return {brand: parsed[1], version: parsed[2]} | |
}) | |
const brands = uaHeader.split(',').map(brandStr => { | |
const [,brand,version] = brandStr.trim().match(REGEX_CLIENT_HINT_BRAND) | |
return { brand, version } | |
}) |
- Removed
console.log()
- Removed
map()
dedicated to trimming - Destructured parsed array
this part isn't defensive enough imo
results from `navigator.userAgent` are overridden. | ||
|
||
### Server Side | ||
|
||
the following request headers are referred to detect a device and a platform. | ||
|
||
- sec-ch-ua | ||
- sec-ch-mobile | ||
- sec-ch-platform | ||
|
||
results from user-agent header are overridden. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
results from `navigator.userAgent` are overridden. | |
### Server Side | |
the following request headers are referred to detect a device and a platform. | |
- sec-ch-ua | |
- sec-ch-mobile | |
- sec-ch-platform | |
results from user-agent header are overridden. | |
Results from `navigator.userAgent` are overridden. | |
### Server Side | |
The following request headers are referred to detect a device and a platform. | |
- `sec-ch-ua` | |
- `sec-ch-mobile` | |
- `sec-ch-platform` | |
Results from user-agent header are overridden. |
const macOS = platform === 'macOS' | ||
const isSafari = undefined | ||
const isFirefox = undefined | ||
const isEdge = hasBrand('Microsoft Edge') |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
these brands' list would benefit from being stored in a kind of enum
Uh oh!
There was an error while loading. Please reload this page.