[core] Fix deepmerge of DOM elements (#20100)

packages/material-ui-utils/src/deepmerge.js

@@ -1,18 +1,18 @@
-export function isObject(item) {
-  return item && typeof item === 'object' && !Array.isArray(item);
+export function isPlainObject(item) {
+  return item && typeof item === 'object' && item.constructor === Object;
 }
 
 export default function deepmerge(target, source, options = { clone: true }) {
   const output = options.clone ? { ...target } : target;
 
-  if (isObject(target) && isObject(source)) {
+  if (isPlainObject(target) && isPlainObject(source)) {
     Object.keys(source).forEach(key => {
       // Avoid prototype pollution
       if (key === '__proto__') {
         return;
       }
 
-      if (isObject(source[key]) && key in target) {
+      if (isPlainObject(source[key]) && key in target) {
         output[key] = deepmerge(target[key], source[key], options);
       } else {
         output[key] = source[key];

packages/material-ui-utils/src/deepmerge.test.js

@@ -9,4 +9,14 @@ describe('deepmerge', () => {
     });
     expect({}.isAdmin).to.equal(undefined);
   });
+
+  // https://github.com/mui-org/material-ui/issues/20095
+  it('should not merge DOM elements', () => {
+    const element = document.createElement('div');
+    const element2 = document.createElement('div');
+
+    const result = deepmerge({ element }, { element: element2 });
+
+    expect(result.element).to.equal(element2);
+  });
 });