Skip to content

Commit

Permalink
fix: add isIE in ua
Browse files Browse the repository at this point in the history
  • Loading branch information
ambar committed Jan 29, 2022
1 parent deeb310 commit d7a6924
Show file tree
Hide file tree
Showing 4 changed files with 48 additions and 25 deletions.
34 changes: 25 additions & 9 deletions packages/griffith-utils/src/__tests__/ua.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,14 +2,30 @@
* @jest-environment jsdom
*/

import ua, {parseUA} from '../ua'

test('ua', () => {
Object.defineProperty(window.navigator, 'userAgent', {
value:
'Mozilla/5.0 (Linux; Android 5.0; SM-G900P Build/LRX21T) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/71.0.3578.98 Mobile Safari/537.36',
})
// eslint-disable-next-line @typescript-eslint/no-var-requires
const {isMobile, isAndroid, isSafari} = require('../ua')
expect(isMobile).toBe(true)
expect(isAndroid).toBe(true)
expect(isSafari).toBe(false)
expect(ua).toMatchInlineSnapshot(`
Object {
"isAndroid": false,
"isIE": false,
"isMobile": false,
"isSafari": false,
}
`)
})

test('parse', () => {
expect(
parseUA(
'Mozilla/5.0 (Linux; Android 5.0; SM-G900P Build/LRX21T) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/71.0.3578.98 Mobile Safari/537.36'
)
).toMatchInlineSnapshot(`
Object {
"isAndroid": true,
"isIE": false,
"isMobile": true,
"isSafari": false,
}
`)
})
22 changes: 11 additions & 11 deletions packages/griffith-utils/src/ua.ts
Original file line number Diff line number Diff line change
@@ -1,13 +1,13 @@
export const isMobile = /iPhone|iPad|iPod|Android/i.test(navigator.userAgent)

export const isAndroid = /(android)/i.test(navigator.userAgent)
export function parseUA(userAgent: string) {
return {
isIE: /MSIE|Trident/i.test(userAgent),
isMobile: /iPhone|iPad|iPod|Android/i.test(userAgent),
isAndroid: /(android)/i.test(userAgent),
isSafari: /^((?!chrome|android).)*safari/i.test(userAgent),
}
}

export const isSafari = /^((?!chrome|android).)*safari/i.test(
navigator.userAgent
export default parseUA(
// TODO: 加一个 context 让各处访问更好
typeof navigator !== 'undefined' ? navigator.userAgent : ''
)

export default {
isMobile,
isAndroid,
isSafari,
}
9 changes: 4 additions & 5 deletions packages/griffith/src/components/Player.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -49,7 +49,6 @@ import useMount from '../hooks/useMount'
import useHandler from '../hooks/useHandler'
import usePlayerShortcuts from './usePlayerShortcuts'
const CONTROLLER_HIDE_DELAY = 3000
const {isMobile} = ua

// 被 Provider 包装后的属性
type InnerPlayerProps = {
Expand Down Expand Up @@ -273,7 +272,7 @@ const InnerPlayer: React.FC<InnerPlayerProps> = ({
isLoadingSwitch.on()
}
// workaround a bug in IE about replaying a video.
if (currentTime !== 0) {
if (ua.isIE && currentTime !== 0) {
handleSeek(0)
}
}
Expand Down Expand Up @@ -488,7 +487,7 @@ const InnerPlayer: React.FC<InnerPlayerProps> = ({
const videoDataLoaded = !isLoading || currentTime !== 0
const renderController = videoDataLoaded && isPlaybackStarted

const controlsOverlay = !isMobile && (
const controlsOverlay = !ua.isMobile && (
<div className={css(styles.overlay, isNeverPlayed && styles.overlayMask)}>
{isPlaybackStarted && isLoading && (
<div className={css(styles.loader)}>
Expand Down Expand Up @@ -609,7 +608,7 @@ const InnerPlayer: React.FC<InnerPlayerProps> = ({
<div className={css(styles.video)}>
<Video
ref={videoRef}
controls={isMobile && isPlaybackStarted && !hideMobileControls}
controls={ua.isMobile && isPlaybackStarted && !hideMobileControls}
paused={!isPlaying}
volume={volume}
loop={loop}
Expand Down Expand Up @@ -655,7 +654,7 @@ const InnerPlayer: React.FC<InnerPlayerProps> = ({
<div
className={css(
styles.coverTime,
isMobile && styles.coverTimeMobile
ua.isMobile && styles.coverTimeMobile
)}
>
{formatDuration(duration)}
Expand Down
8 changes: 8 additions & 0 deletions packages/griffith/src/utils/parseUA.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
export default function parseUA(userAgent: string) {
return {
isIE: /MSIE|Trident/i.test(userAgent),
isMobile: /iPhone|iPad|iPod|Android/i.test(userAgent),
isAndroid: /(android)/i.test(userAgent),
isSafari: /^((?!chrome|android).)*safari/i.test(userAgent),
}
}

0 comments on commit d7a6924

Please sign in to comment.