Description
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