diff --git a/packages/style-unit/CHANGELOG.md b/packages/style-unit/CHANGELOG.md index 272478e286..9f6d7ce3ab 100644 --- a/packages/style-unit/CHANGELOG.md +++ b/packages/style-unit/CHANGELOG.md @@ -1,5 +1,9 @@ ## Changelog +## v3.0.6 + +- Fix: maximum call caused by large base64. + ## v3.0.5 - Fix: fix transform rpx error in node env. diff --git a/packages/style-unit/package.json b/packages/style-unit/package.json index 6ed0ec020e..66bc86aad6 100644 --- a/packages/style-unit/package.json +++ b/packages/style-unit/package.json @@ -1,6 +1,6 @@ { "name": "style-unit", - "version": "3.0.5", + "version": "3.0.6", "description": "style-unit", "license": "BSD-3-Clause", "main": "lib/index.js", diff --git a/packages/style-unit/src/__tests__/style-unit.web.js b/packages/style-unit/src/__tests__/style-unit.web.js index ba390ad67c..1c6822bf83 100644 --- a/packages/style-unit/src/__tests__/style-unit.web.js +++ b/packages/style-unit/src/__tests__/style-unit.web.js @@ -48,6 +48,11 @@ describe('Web style-unit', () => { expect(convertUnit('375rpx 20px 375rpx', 'margin')).toEqual('100vw 20px 100vw'); expect(convertUnit('translateX(375rpx) translateY(375rpx)', 'transform')).toEqual('translateX(100vw) translateY(100vw)'); }); + + it('should not convert base64', () => { + const base64String = 'url(\'data:image/png;base64,iVBORw30rpx...)'; + expect(convertUnit(base64String, 'backgroundImage')).toEqual(base64String); + }); }); describe('exported API', () => { diff --git a/packages/style-unit/src/index.js b/packages/style-unit/src/index.js index 9facedb339..8109174784 100644 --- a/packages/style-unit/src/index.js +++ b/packages/style-unit/src/index.js @@ -127,6 +127,19 @@ export function setTargetPlatform(platform) { targetPlatform = platform; } +const _convertUnit = cached((value, prop, platform) => { + if (platform) { + setTargetPlatform(platform); + } + return isRpx(value) ? calcRpx(value) : value; +}); + +const REG_BASE64 = /data:image\/(png|jpg|jpeg|gif|svg|webp|bmp|dpg);base64,/; +function isBase64(str) { + // Maximal base64 string start with `url('data:image/jpeg;base64,` which contains 30 characters. + return typeof str === 'string' && REG_BASE64.test(str.substring(0, 30)); +} + /** * Convert rpx. * @param value @@ -134,9 +147,7 @@ export function setTargetPlatform(platform) { * @param platform * @return {String} Transformed value. */ -export const convertUnit = cached((value, prop, platform) => { - if (platform) { - setTargetPlatform(platform); - } - return isRpx(value) ? calcRpx(value) : value; -}); +export const convertUnit = (value, prop, platform) => { + // Do not to convert base64 value which may cause maximum error. + return isBase64(value) ? value : _convertUnit(value, prop, platform); +};