UNPKG

react-native-ui-lib

Version:

UI Components Library for React Native ###### Lateset version support RN44

156 lines (128 loc) • 6.07 kB
var _extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source){if(Object.prototype.hasOwnProperty.call(source,key)){target[key]=source[key];}}}return target;};var _index=require('../index');var _index2=_interopRequireDefault(_index); var _style=require('../../../style');function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj};} describe('Button',function(){ describe('getBackgroundColor',function(){ it('should return backgroundColor according to official prop',function(){ var uut=new _index2.default({backgroundColor:'red'}); expect(uut.getBackgroundColor()).toEqual('red'); }); it('should return backgroundColor according to modifier',function(){ var uut=new _index2.default({'bg-orange30':true}); expect(uut.getBackgroundColor()).toEqual(_style.Colors.orange30); }); it('should return undefined if this button is outline',function(){ var uut=new _index2.default({backgroundColor:'blue',outline:true}); expect(uut.getBackgroundColor()).toEqual('transparent'); }); it('should return undefined if this button is link',function(){ var uut=new _index2.default({'bg-orange30':true,link:true}); expect(uut.getBackgroundColor()).toEqual('transparent'); }); it('should return theme disabled color if button is disabled',function(){ var uut=new _index2.default({'bg-orange30':true,disabled:true}); expect(uut.getBackgroundColor()).toEqual(_style.ThemeManager.CTADisabledColor); }); }); describe('getLabelColor',function(){ it('should return theme ctaTextColor by default',function(){ var uut=new _index2.default({}); expect(uut.getLabelColor()).toEqual(_style.ThemeManager.CTATextColor); }); it('should return dark10 color for link',function(){ var uut=new _index2.default({link:true}); expect(uut.getLabelColor()).toEqual(_style.Colors.dark10); }); it('should return dark10 color for outline',function(){ var uut=new _index2.default({outline:true}); expect(uut.getLabelColor()).toEqual(_style.Colors.dark10); }); it('should return color according to color modifier',function(){ var uut=new _index2.default({red10:true}); expect(uut.getLabelColor()).toEqual(_style.Colors.red10); }); it('should return color according to color prop',function(){ var uut=new _index2.default({red10:true,color:'green'}); expect(uut.getLabelColor()).toEqual('green'); }); it('should return disabled text color according to theme for link/outline button',function(){ var uut=new _index2.default({red10:true,color:'green',link:true,disabled:true}); expect(uut.getLabelColor()).toEqual(_style.ThemeManager.CTADisabledColor); }); }); describe('getLabelSizeStyle',function(){ it('should return style for large button',function(){ var uut=new _index2.default({size:'large'}); expect(uut.getLabelSizeStyle()).toEqual({paddingHorizontal:36}); }); it('should return style for medium button',function(){ var uut=new _index2.default({size:'medium'}); expect(uut.getLabelSizeStyle()).toEqual(_extends({paddingHorizontal:24},_style.Typography.text80)); }); it('should return style for small button',function(){ var uut=new _index2.default({size:'small'}); expect(uut.getLabelSizeStyle()).toEqual(_extends({paddingHorizontal:15},_style.Typography.text80)); }); it('should have no padding of button is a link',function(){ var uut=new _index2.default({size:'medium',link:true}); expect(uut.getLabelSizeStyle()).toEqual(_extends({paddingHorizontal:0},_style.Typography.text80)); }); }); describe('getOutlineStyle',function(){ it('should return undefined when outline is false',function(){ var uut=new _index2.default({outline:false}); expect(uut.getOutlineStyle()).toEqual(undefined); }); it('should return borderWidth style with default borderColor when outline is true',function(){ var uut=new _index2.default({outline:true}); expect(uut.getOutlineStyle()).toEqual({borderWidth:0.5,borderColor:_style.Colors.dark70}); }); it('should return undefined when link is true, even when outline is true',function(){ var uut=new _index2.default({outline:true,link:true}); expect(uut.getOutlineStyle()).toEqual(undefined); }); it('should return outlineColor according to prop',function(){ var uut=new _index2.default({outline:true,outlineColor:'red'}); expect(uut.getOutlineStyle()).toEqual({borderWidth:0.5,borderColor:'red'}); }); it('should return outline even if only got outlineColor prop',function(){ var uut=new _index2.default({outlineColor:'yellow'}); expect(uut.getOutlineStyle()).toEqual({borderWidth:0.5,borderColor:'yellow'}); }); }); describe('getBorderRadiusStyle',function(){ it('should return undefined when no border radius sent',function(){ var uut=new _index2.default({}); expect(uut.getBorderRadiusStyle()).toEqual(undefined); }); it('should return given border radius when use plain number',function(){ var uut=new _index2.default({borderRadius:12}); expect(uut.getBorderRadiusStyle()).toEqual({borderRadius:12}); }); it('should return 0 border radius when button is a link',function(){ var uut=new _index2.default({link:true}); expect(uut.getBorderRadiusStyle()).toEqual({borderRadius:0}); }); it('should return 0 border radius when button is full width',function(){ var uut=new _index2.default({fullWidth:true}); expect(uut.getBorderRadiusStyle()).toEqual({borderRadius:0}); }); it('should return 0 border radius when border radius prop is 0',function(){ var uut=new _index2.default({borderRadius:0}); expect(uut.getBorderRadiusStyle()).toEqual({borderRadius:0}); }); }); describe('getContainerSizeStyle',function(){ it('should return style for large button',function(){ var uut=new _index2.default({size:'large'}); expect(uut.getContainerSizeStyle()).toEqual({paddingVertical:16,minWidth:138}); }); it('should return style for medium button',function(){ var uut=new _index2.default({size:'medium'}); expect(uut.getContainerSizeStyle()).toEqual({paddingVertical:11,minWidth:125}); }); it('should return style for small button',function(){ var uut=new _index2.default({size:'small'}); expect(uut.getContainerSizeStyle()).toEqual({paddingVertical:5,minWidth:74}); }); }); });