react-routsy - npm Package Compare versions

Comparing version 1.2.0 to 1.2.1

index.js

@@ -80,16 +80,20 @@ var React = require('react');
 
-  componentDidMount () {
+  componentDidMount: function () {
 
     this.setActiveClassName();
+    onHashChange(this.hashChanged);
   },
 
-  setActiveClassName () {
+  hashChanged: function () {
 
-    if (SmallRouter.currentPath() === this.props.path) {
-      this.setState({
-        active: true
-      });
-    }
+    this.setActiveClassName();
   },
 
+  setActiveClassName: function () {
+
+    this.setState({
+      active: (SmallRouter.currentPath() === this.props.path)
+    });
+  },
+
   gotoPath: function (e) {
@@ -104,14 +108,15 @@
 
-    let style = assign({
-      cursor: 'pointer'
-    }, this.state.active ? this.props.activeStyle : {});
+    let style = assign(
+      {
+        cursor: 'pointer'
+      },
+      this.props.style,
+      this.state.active ? this.props.activeStyle : {}
+    )
 
-    return (
-      <a
-        style={style}
-        onClick={this.gotoPath}
-        className={this.state.active ? this.props.activeClassName : null} >
-          {this.props.children}
-      </a>
-    );
+    return DOM.a({
+      style: style,
+      onClick: this.gotoPath,
+      className: this.state.active ? this.props.activeClassName : null
+    }, this.props.children);
   }
@@ -118,0 +123,0 @@ });

package.json

 {
   "name": "react-routsy",
-  "version": "1.2.0",
+  "version": "1.2.1",
   "description": "Tiny React component for routing on individual pages",
@@ -5,0 +5,0 @@ "main": "index.js",

test/index.js

@@ -252,2 +252,16 @@ import {assert} from 'chai';
 
+  it('removes the active class name when hash changes', (done) => {
+
+    navigateTo('/');
+    let component = TestUtils.renderIntoDocument(<Link path='/path1' activeClassName="customActive" />);
+    TestUtils.Simulate.click(component.getDOMNode());
+    navigateTo('/');
+
+    setTimeout(() => {
+
+      assert.notOk(component.getDOMNode().classList.contains('customActive'), 'active class set');
+      done();
+    }, 0);
+  });
+
   it('sets custom active style', () => {
@@ -261,2 +275,22 @@
   });
+
+  it('removes active style when hash changes', (done) => {
+
+    navigateTo('/');
+    let component = TestUtils.renderIntoDocument(<Link path='/path1' activeStyle={{color: 'red'}} />);
+    TestUtils.Simulate.click(component.getDOMNode());
+    navigateTo('/');
+
+    setTimeout(() => {
+      assert.equal(component.getDOMNode().style.color, '', 'active style set');
+      done();
+    }, 0);
+  });
+
+  it('pass through style prop', () => {
+
+    let component = TestUtils.renderIntoDocument(<Link path='/' style={{color: 'red'}}/>);
+
+    assert.equal(component.getDOMNode().style.color, 'red', 'active style set');
+  });
 });

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

17527

increased by7.03%

Lines of code

394

increased by7.36%

No dependency changes