Skip to content

Strange behavior on Dropdown Link item #3593

Closed
@Jean-PhilippeD

Description

@Jean-PhilippeD

Bug Report

Using a Dropdown with options as Link, I get the error in a specific case :

Uncaught Invariant Violation: Unable to find node on an unmounted component.

Context :
I use react-router-dom
I've built a Header with Menu component.
The first Menu.Item is a header with a Link to /
The second item is a Component I made which handle a Dropdown Menu with few options, each options is also a Link:

const options = [
        {
            "key": "users",
            "text": "User management",
            "to": "/administration/users/",
            "icon": "users",
            "as": Link
        },
        {
            "key": "mail",
            "text": "Mail management",
            "to": "/administration/mail/",
            "icon": "mail outline",
            "as": Link
        }
    ]

Steps

1.When I'm on route "/" and I refresh the browser and try to click on one item from the dropdown menu, it fails with the error I've pasted upside.
2. If I refresh the browser, being on the route "/administration/users", I get the expected page.
3. Then If I click on the Header Item, I go to / as expected.
4. Then I can now navigate finely to /administration/* without errors.
5. If I refresh again from everywhere, the Dropdown Link Items fails again.

I tried to create a Menu.Item with one of the route in the Dropdown options, and I have no issue with it.

Each time I refresh my browser, the Dropdown Links does not work until I navigate first to a Link outside dropdown menu.

Expected Result

I should not have any errors in routing with Dropdown Item.

Actual Result

As far I do not refresh the page, routing works, but if I refresh the browser, I need to go on / before moving onto routes accessible from dropdown items.

Version

react-router-dom: 5.0.0
react: 16.8.6
semantic-ui: 2.4.2,
semantic-ui-react: 0.86.0

Testcase

If needed, I'll try to make a testcase

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions