fix: forwardRef to be remounted every frame. React-router to merge components

Author: theKashey

src/reactHotLoader.js

@@ -19,6 +19,7 @@ import {
   isTypeBlacklisted,
   registerComponent,
   updateFunctionProxyById,
+  isRegisteredComponent,
 } from './reconciler/proxies'
 import configuration from './configuration'
 import logger from './logger'
@@ -59,6 +60,17 @@ const updateForward = (target, { render }) => {
 }
 
 export const hotComponentCompare = (oldType, newType, setNewType) => {
+  if (oldType === newType) {
+    return true
+  }
+
+  if (
+    (isRegisteredComponent(oldType) || isRegisteredComponent(newType)) &&
+    resolveType(oldType) !== resolveType(newType)
+  ) {
+    return false
+  }
+
   if (isForwardType({ type: oldType }) && isForwardType({ type: newType })) {
     if (areSwappable(oldType.render, newType.render)) {
       setNewType(newType)
@@ -75,10 +87,6 @@ export const hotComponentCompare = (oldType, newType, setNewType) => {
     return false
   }
 
-  if (oldType === newType) {
-    return true
-  }
-
   if (areSwappable(newType, oldType)) {
     const unwrapFactory = newType[UNWRAP_PROXY]
     const oldProxy = unwrapFactory && getProxyByType(unwrapFactory())
@@ -142,14 +150,19 @@ const reactHotLoader = {
         // component got replaced. Need to reconcile
         incrementGeneration()
 
-        if (isTypeBlacklisted(type) || isTypeBlacklisted(proxy.getCurrent())) {
-          logger.error(
-            'React-hot-loader: Cold component',
-            uniqueLocalName,
-            'at',
-            fileName,
-            'has been updated',
-          )
+        if (!reactHotLoader.IS_REACT_MERGE_ENABLED) {
+          if (
+            isTypeBlacklisted(type) ||
+            isTypeBlacklisted(proxy.getCurrent())
+          ) {
+            logger.error(
+              'React-hot-loader: Cold component',
+              uniqueLocalName,
+              'at',
+              fileName,
+              'has been updated',
+            )
+          }
         }
       }