use beginning of location path name when checking for active items

__tests__/components/NavExpandableGroup.test.jsx

@@ -26,4 +26,38 @@ describe('NavExpandableGroup', () => {
     expect(component.navItemPaths).toEqual(['/foo', '/bar', '/fiz']);
     expect(component.isActiveGroup()).toEqual(true);
   });
+
+  describe('isActivePath', () => {
+    const params = [
+      ['/fo', '/foo', false],
+      ['/foo', '/foo', true],
+      ['/foo/1/bar/fiz', '/foo', true],
+      ['/foo/1/bar/fiz', 'foo', false],
+      ['/foo/1/bar/fiz', 'foo/', false],
+      ['/foo/1/bar/fiz', '/bar', false],
+      ['/foo/1/bar/fiz', '/fiz', false],
+    ];
+
+    params.forEach(([location, path, expected]) => {
+      test(`when location is ${location}', isActivePath('${path}') returns ${expected} `, () => {
+        const component = mount(
+          <MemoryRouter initialEntries={[location]}>
+            <Nav aria-label="Test Navigation">
+              <NavExpandableGroup
+                groupId="test"
+                title="Test"
+                routes={[
+                  { path: '/foo', title: 'Foo' },
+                  { path: '/bar', title: 'Bar' },
+                  { path: '/fiz', title: 'Fiz' },
+                ]}
+              />
+            </Nav>
+          </MemoryRouter>
+        ).find('NavExpandableGroup').instance();
+
+        expect(component.isActivePath(path)).toEqual(expected);
+      });
+    });
+  });
 });

src/components/NavExpandableGroup.jsx

@@ -21,7 +21,7 @@ class NavExpandableGroup extends Component {
   isActivePath = (path) => {
     const { history } = this.props;
 
-    return history.location.pathname.includes(path);
+    return history.location.pathname.startsWith(path);
   };
 
   render () {