rax-server-renderer - npm Package Compare versions

Comparing version 1.3.0 to 1.4.0-0

es/index.js

 import { shared } from 'rax';
+import { convertUnit, setViewportWidth, setUnitPrecision, setTargetPlatform } from 'style-unit';
 import { BOOLEAN, BOOLEANISH_STRING, OVERLOADED_BOOLEAN, shouldRemoveAttribute, getPropertyInfo } from './attribute';
 import { UNITLESS_NUMBER_PROPS } from './CSSProperty';
+setTargetPlatform('web');
 var EMPTY_OBJECT = {};
@@ -62,7 +64,6 @@ var VOID_ELEMENTS = {
   viewportWidth: 750,
-  unitPrecision: 5
+  unitPrecision: 4
 };
 var UPPERCASE_REGEXP = /[A-Z]/g;
 var NUMBER_REGEXP = /^[0-9]*$/;
-var RPX_REG = /[-+]?\d*\.?\d+rpx/g;
 var CSSPropCache = {};
@@ -101,5 +102,3 @@
     if (typeof val === 'string' && val.indexOf('rpx') > -1) {
-      val = val.replace(RPX_REG, function (rpx) {
-        return rpx2vw(rpx, options);
-      });
+      val = convertUnit(val);
     }
@@ -192,9 +191,2 @@
 
-function rpx2vw(rpx, opts) {
-  var pixels = parseFloat(rpx);
-  var vw = pixels / opts.viewportWidth * 100;
-  var parsedVal = parseFloat(vw.toFixed(opts.unitPrecision));
-  return parsedVal + 'vw';
-}
-
 function checkContext(element) {
@@ -318,2 +310,4 @@ // Filter context by `contextTypes` or prevent pass context to child without `contextTypes`,
     this.previousWasTextNode = false;
+    setViewportWidth(options.viewportWidth);
+    setUnitPrecision(options.unitPrecision);
   }
@@ -320,0 +314,0 @@

lib/index.js

@@ -5,6 +5,8 @@ "use strict";
 exports.renderToString = renderToString;
-exports.default = void 0;
+exports["default"] = void 0;
 
 var _rax = require("rax");
 
+var _styleUnit = require("style-unit");
+
 var _attribute = require("./attribute");
@@ -14,2 +16,3 @@
 
+(0, _styleUnit.setTargetPlatform)('web');
 var EMPTY_OBJECT = {};
@@ -73,7 +76,6 @@ var VOID_ELEMENTS = {
   viewportWidth: 750,
-  unitPrecision: 5
+  unitPrecision: 4
 };
 var UPPERCASE_REGEXP = /[A-Z]/g;
 var NUMBER_REGEXP = /^[0-9]*$/;
-var RPX_REG = /[-+]?\d*\.?\d+rpx/g;
 var CSSPropCache = {};
@@ -112,5 +114,3 @@
     if (typeof val === 'string' && val.indexOf('rpx') > -1) {
-      val = val.replace(RPX_REG, function (rpx) {
-        return rpx2vw(rpx, options);
-      });
+      val = (0, _styleUnit.convertUnit)(val);
     }
@@ -203,9 +203,2 @@
 
-function rpx2vw(rpx, opts) {
-  var pixels = parseFloat(rpx);
-  var vw = pixels / opts.viewportWidth * 100;
-  var parsedVal = parseFloat(vw.toFixed(opts.unitPrecision));
-  return parsedVal + 'vw';
-}
-
 function checkContext(element) {
@@ -329,2 +322,4 @@ // Filter context by `contextTypes` or prevent pass context to child without `contextTypes`,
     this.previousWasTextNode = false;
+    (0, _styleUnit.setViewportWidth)(options.viewportWidth);
+    (0, _styleUnit.setUnitPrecision)(options.unitPrecision);
   }
@@ -512,2 +507,2 @@
 };
-exports.default = _default;
+exports["default"] = _default;

package.json

 {
   "name": "rax-server-renderer",
-  "version": "1.3.0",
+  "version": "1.4.0-0",
   "description": "Rax renderer for server-side render.",
@@ -18,2 +18,5 @@ "license": "BSD-3-Clause",
   },
+  "dependencies": {
+    "style-unit": "^3.0.0"
+  },
   "devDependencies": {
@@ -20,0 +23,0 @@ "prop-types": "^15.7.2",

src/__tests__/renderToString.js

@@ -362,12 +362,12 @@ /* @jsx createElement */
       }
-    
+
       componentDidCatch(error, errorInfo) {
         // log error
       }
-    
+
       render() {
-        return this.props.children; 
+        return this.props.children;
       }
     }
-    
+
     function MyWidget() {
@@ -397,12 +397,12 @@ throw new Error('widget error');
       }
-    
+
       componentDidCatch(error, errorInfo) {
         mockFn();
       }
-    
+
       render() {
-        return this.props.children; 
+        return this.props.children;
       }
     }
-    
+
     function MyWidget() {
@@ -409,0 +409,0 @@ throw new Error('widget error');

src/__tests__/styles.js

@@ -160,3 +160,3 @@ /* @jsx createElement */
       const str = renderToString(<div style={style} />);
-      expect(str).toBe('<div style="flex:1;font-size:2.13333vw;width:100%;"></div>');
+      expect(str).toBe('<div style="flex:1;font-size:2.1333vw;width:100%;"></div>');
     });
@@ -194,4 +194,13 @@
       const str = renderToString(<div style={style} />);
-      expect(str).toBe('<div style="transform:translate3d(-26.66667vw, 0, 0);"></div>');
+      expect(str).toBe('<div style="transform:translate3d(-26.6667vw, 0, 0);"></div>');
     });
+
+    it('render url() with rpx', () => {
+      const style = {
+        backgroundImage: 'url("abc2rpx")'
+      };
+
+      const str = renderToString(<div style={style} />);
+      expect(str).toBe('<div style="background-image:url(\"abc2rpx\");"></div>');
+    });
   });
@@ -198,0 +207,0 @@

src/index.js

 import { shared } from 'rax';
+import { convertUnit, setViewportWidth, setUnitPrecision, setTargetPlatform } from 'style-unit';
 import { BOOLEAN, BOOLEANISH_STRING, OVERLOADED_BOOLEAN, shouldRemoveAttribute, getPropertyInfo } from './attribute';
 import { UNITLESS_NUMBER_PROPS } from './CSSProperty';
 
+setTargetPlatform('web');
+
 const EMPTY_OBJECT = {};
@@ -64,7 +67,6 @@
   viewportWidth: 750,
-  unitPrecision: 5
+  unitPrecision: 4
 };
 const UPPERCASE_REGEXP = /[A-Z]/g;
 const NUMBER_REGEXP = /^[0-9]*$/;
-const RPX_REG = /[-+]?\d*\.?\d+rpx/g;
 const CSSPropCache = {};
@@ -96,5 +98,3 @@
     if (typeof val === 'string' && val.indexOf('rpx') > -1) {
-      val = val.replace(RPX_REG, (rpx) => {
-        return rpx2vw(rpx, options);
-      });
+      val = convertUnit(val);
     }
@@ -184,10 +184,2 @@
 
-function rpx2vw(rpx, opts) {
-  const pixels = parseFloat(rpx);
-  const vw = pixels / opts.viewportWidth * 100;
-  const parsedVal = parseFloat(vw.toFixed(opts.unitPrecision));
-
-  return parsedVal + 'vw';
-}
-
 function checkContext(element) {
@@ -311,2 +303,4 @@ // Filter context by `contextTypes` or prevent pass context to child without `contextTypes`,
     this.previousWasTextNode = false;
+    setViewportWidth(options.viewportWidth);
+    setUnitPrecision(options.unitPrecision);
   }
@@ -413,3 +407,3 @@
             return this.renderElementToString(renderedElement, currentContext);
-          } catch(e) {
+          } catch (e) {
             instance.componentDidCatch(e);
@@ -416,0 +410,0 @@ return ERROR_COMMENT;

New alerts

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

145507

increased by0.02%

Worsened metrics

Dependency count

2

increased by100%

Lines of code

4419

decreased by-0.18%

Number of low quality alerts

2

increased by100%

Dependency changes

• + Addedstyle-unit@^3.0.0

• + Added@uni/env@1.1.1(transitive)

• + Addedstyle-unit@3.0.5(transitive)

• + Addeduniversal-env@3.3.3(transitive)