diff --git a/src/store/slices/deviceSlice.test.js b/src/store/slices/deviceSlice.test.js index f17eae0b..f91adc83 100644 --- a/src/store/slices/deviceSlice.test.js +++ b/src/store/slices/deviceSlice.test.js @@ -7,26 +7,49 @@ * 3. selector 函数测试 */ -import deviceReducer, { updateScreenSize, selectIsMobile } from './deviceSlice'; +import deviceReducer, { + updateScreenSize, + selectIsMobile, + selectIsTablet, + selectIsDesktop, + selectDeviceType, + DeviceType, +} from './deviceSlice'; describe('deviceSlice', () => { describe('reducer', () => { it('should return the initial state', () => { const initialState = deviceReducer(undefined, { type: '@@INIT' }); expect(initialState).toHaveProperty('isMobile'); + expect(initialState).toHaveProperty('isTablet'); + expect(initialState).toHaveProperty('isDesktop'); + expect(initialState).toHaveProperty('deviceType'); expect(typeof initialState.isMobile).toBe('boolean'); + expect(typeof initialState.isTablet).toBe('boolean'); + expect(typeof initialState.isDesktop).toBe('boolean'); + expect(typeof initialState.deviceType).toBe('string'); }); it('should handle updateScreenSize', () => { // 模拟初始状态 - const initialState = { isMobile: false }; + const initialState = { + isMobile: false, + isTablet: false, + isDesktop: true, + deviceType: DeviceType.DESKTOP, + }; - // 执行 action(注意:实际 isMobile 值由 detectIsMobile() 决定) + // 执行 action(注意:实际值由 detectDeviceType() 决定) const newState = deviceReducer(initialState, updateScreenSize()); // 验证状态结构 expect(newState).toHaveProperty('isMobile'); + expect(newState).toHaveProperty('isTablet'); + expect(newState).toHaveProperty('isDesktop'); + expect(newState).toHaveProperty('deviceType'); expect(typeof newState.isMobile).toBe('boolean'); + expect(typeof newState.isTablet).toBe('boolean'); + expect(typeof newState.isDesktop).toBe('boolean'); }); }); @@ -35,22 +58,48 @@ describe('deviceSlice', () => { const mockState = { device: { isMobile: true, + isTablet: false, + isDesktop: false, + deviceType: DeviceType.MOBILE, }, }; - const result = selectIsMobile(mockState); - expect(result).toBe(true); + expect(selectIsMobile(mockState)).toBe(true); + expect(selectIsTablet(mockState)).toBe(false); + expect(selectIsDesktop(mockState)).toBe(false); + expect(selectDeviceType(mockState)).toBe(DeviceType.MOBILE); }); - it('selectIsMobile should return false for desktop', () => { + it('selectIsTablet should return correct value', () => { const mockState = { device: { isMobile: false, + isTablet: true, + isDesktop: false, + deviceType: DeviceType.TABLET, }, }; - const result = selectIsMobile(mockState); - expect(result).toBe(false); + expect(selectIsMobile(mockState)).toBe(false); + expect(selectIsTablet(mockState)).toBe(true); + expect(selectIsDesktop(mockState)).toBe(false); + expect(selectDeviceType(mockState)).toBe(DeviceType.TABLET); + }); + + it('selectIsDesktop should return correct value', () => { + const mockState = { + device: { + isMobile: false, + isTablet: false, + isDesktop: true, + deviceType: DeviceType.DESKTOP, + }, + }; + + expect(selectIsMobile(mockState)).toBe(false); + expect(selectIsTablet(mockState)).toBe(false); + expect(selectIsDesktop(mockState)).toBe(true); + expect(selectDeviceType(mockState)).toBe(DeviceType.DESKTOP); }); }); @@ -60,4 +109,12 @@ describe('deviceSlice', () => { expect(action.type).toBe('device/updateScreenSize'); }); }); + + describe('DeviceType constants', () => { + it('should have correct values', () => { + expect(DeviceType.MOBILE).toBe('mobile'); + expect(DeviceType.TABLET).toBe('tablet'); + expect(DeviceType.DESKTOP).toBe('desktop'); + }); + }); });