NavLink also accept Link properties, fixed #1563 (#1564)

(cherry picked from commit 586c457)
infernojs · Aug 21, 2021 · 6480b05 · 6480b05
1 parent 521a4c3
commit 6480b05
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 5 deletions.
diff --git a/packages/inferno-router/__tests__/NavLink.spec.tsx b/packages/inferno-router/__tests__/NavLink.spec.tsx
@@ -327,4 +327,19 @@ describe('NavLink', () => {
       expect(node.textContent).toEqual('Pasta!');
     });
   });
+
+  describe('html link attributes', () => {
+    it('accept html link attributes', () => {
+      render(
+        <MemoryRouter initialEntries={['/pasta']}>
+          <NavLink to="/pasta" title="pasta">
+            Pasta!
+          </NavLink>
+        </MemoryRouter>,
+        node
+      );
+      const a = node.getElementsByTagName('a')[0];
+      expect(a.title).toEqual('pasta');
+    })
+  })
 });
diff --git a/packages/inferno-router/src/NavLink.ts b/packages/inferno-router/src/NavLink.ts
@@ -1,22 +1,20 @@
 import { createComponentVNode, VNode } from 'inferno';
 import { VNodeFlags } from 'inferno-vnode-flags';
 import { Route } from './Route';
-import { Link } from './Link';
+import {ILinkProps, Link} from './Link';
 import { combineFrom } from 'inferno-shared';
 import type { Location } from 'history';
 
 function filter(i) {
   return i;
 }
 
-interface NavLinkProps {
+interface NavLinkProps extends ILinkProps {
   to: string | Location;
   exact?: boolean;
   strict?: boolean;
-  onClick?: any;
   location?: any;
   activeClassName?: string;
-  className?: string;
   activeStyle?: any;
   style?: any;
   isActive?: (match, location) => boolean;
@@ -40,7 +38,7 @@ export function NavLink({
   isActive: getIsActive,
   ariaCurrent = 'true',
   ...rest
-}: NavLinkProps): any {
+}: NavLinkProps & LinkHTMLAttributes<HTMLLinkElement>): any {
   function linkComponent({ location, match }): VNode {
     const isActive = Boolean(getIsActive ? getIsActive(match, location) : match);