diff --git a/packages/react-dom-bindings/src/client/validateDOMNesting.js b/packages/react-dom-bindings/src/client/validateDOMNesting.js
index 2f192cd18bd94..49d8b5c158f62 100644
--- a/packages/react-dom-bindings/src/client/validateDOMNesting.js
+++ b/packages/react-dom-bindings/src/client/validateDOMNesting.js
@@ -7,7 +7,54 @@
  * @flow
  */
 
-import {getCurrentParentStackInDev} from 'react-reconciler/src/ReactCurrentFiber';
+import type {Fiber} from 'react-reconciler/src/ReactInternalTypes';
+import type {HydrationDiffNode} from 'react-reconciler/src/ReactFiberHydrationDiffs';
+
+import {enableOwnerStacks} from 'shared/ReactFeatureFlags';
+
+import {
+  current,
+  runWithFiberInDEV,
+} from 'react-reconciler/src/ReactCurrentFiber';
+import {
+  HostComponent,
+  HostHoistable,
+  HostSingleton,
+  HostText,
+} from 'react-reconciler/src/ReactWorkTags';
+
+import {describeDiff} from 'react-reconciler/src/ReactFiberHydrationDiffs';
+
+function describeAncestors(
+  ancestor: Fiber,
+  child: Fiber,
+  props: null | {children: null},
+): string {
+  let fiber: null | Fiber = child;
+  let node: null | HydrationDiffNode = null;
+  let distanceFromLeaf = 0;
+  while (fiber) {
+    if (fiber === ancestor) {
+      distanceFromLeaf = 0;
+    }
+    node = {
+      fiber: fiber,
+      children: node !== null ? [node] : [],
+      serverProps:
+        fiber === child ? props : fiber === ancestor ? null : undefined,
+      serverTail: [],
+      distanceFromLeaf: distanceFromLeaf,
+    };
+    distanceFromLeaf++;
+    fiber = fiber.return;
+  }
+  if (node !== null) {
+    // Describe the node using the hydration diff logic.
+    // Replace + with - to mark ancestor and child. It's kind of arbitrary.
+    return describeDiff(node).replaceAll(/^[+-]/gm, '>');
+  }
+  return '';
+}
 
 type Info = {tag: string};
 export type AncestorInfoDev = {
@@ -440,6 +487,21 @@ function findInvalidAncestorForTag(
 
 const didWarn: {[string]: boolean} = {};
 
+function findAncestor(parent: null | Fiber, tagName: string): null | Fiber {
+  while (parent) {
+    switch (parent.tag) {
+      case HostComponent:
+      case HostHoistable:
+      case HostSingleton:
+        if (parent.type === tagName) {
+          return parent;
+        }
+    }
+    parent = parent.return;
+  }
+  return null;
+}
+
 function validateDOMNesting(
   childTag: string,
   ancestorInfo: AncestorInfoDev,
@@ -470,6 +532,14 @@ function validateDOMNesting(
     }
     didWarn[warnKey] = true;
 
+    const child = current;
+    const ancestor = child ? findAncestor(child.return, ancestorTag) : null;
+
+    const ancestorDescription =
+      child !== null && ancestor !== null
+        ? describeAncestors(ancestor, child, null)
+        : '';
+
     const tagDisplayName = '<' + childTag + '>';
     if (invalidParent) {
       let info = '';
@@ -478,33 +548,45 @@ function validateDOMNesting(
           ' Add a <tbody>, <thead> or <tfoot> to your code to match the DOM tree generated by ' +
           'the browser.';
       }
-      // Don't transform into consoleWithStackDev here because we add a manual stack.
-      // We use the parent stack here instead of the owner stack because the parent
-      // stack has more useful context for nesting.
-      // TODO: Format this as a linkified "diff view" with props instead of
-      // a stack trace since the stack trace format is now for owner stacks.
-      console['error'](
+      console.error(
         'In HTML, %s cannot be a child of <%s>.%s\n' +
           'This will cause a hydration error.%s',
         tagDisplayName,
         ancestorTag,
         info,
-        getCurrentParentStackInDev(),
+        ancestorDescription,
       );
     } else {
-      // Don't transform into consoleWithStackDev here because we add a manual stack.
-      // We use the parent stack here instead of the owner stack because the parent
-      // stack has more useful context for nesting.
-      // TODO: Format this as a linkified "diff view" with props instead of
-      // a stack trace since the stack trace format is now for owner stacks.
-      console['error'](
+      console.error(
         'In HTML, %s cannot be a descendant of <%s>.\n' +
           'This will cause a hydration error.%s',
         tagDisplayName,
         ancestorTag,
-        getCurrentParentStackInDev(),
+        ancestorDescription,
       );
     }
+    if (enableOwnerStacks && child) {
+      // For debugging purposes find the nearest ancestor that caused the issue.
+      // The stack trace of this ancestor can be useful to find the cause.
+      // If the parent is a direct parent in the same owner, we don't bother.
+      const parent = child.return;
+      if (
+        ancestor !== null &&
+        parent !== null &&
+        (ancestor !== parent || parent._debugOwner !== child._debugOwner)
+      ) {
+        runWithFiberInDEV(ancestor, () => {
+          console.error(
+            // We repeat some context because this log might be taken out of context
+            // such as in React DevTools or grouped server logs.
+            '<%s> cannot contain a nested %s.\n' +
+              'See this log for the ancestor stack trace.',
+            ancestorTag,
+            tagDisplayName,
+          );
+        });
+      }
+    }
     return false;
   }
   return true;
@@ -522,31 +604,33 @@ function validateTextNesting(childText: string, parentTag: string): boolean {
     }
     didWarn[warnKey] = true;
 
+    const child = current;
+    const ancestor = child ? findAncestor(child, parentTag) : null;
+
+    const ancestorDescription =
+      child !== null && ancestor !== null
+        ? describeAncestors(
+            ancestor,
+            child,
+            child.tag !== HostText ? {children: null} : null,
+          )
+        : '';
+
     if (/\S/.test(childText)) {
-      // Don't transform into consoleWithStackDev here because we add a manual stack.
-      // We use the parent stack here instead of the owner stack because the parent
-      // stack has more useful context for nesting.
-      // TODO: Format this as a linkified "diff view" with props instead of
-      // a stack trace since the stack trace format is now for owner stacks.
-      console['error'](
+      console.error(
         'In HTML, text nodes cannot be a child of <%s>.\n' +
           'This will cause a hydration error.%s',
         parentTag,
-        getCurrentParentStackInDev(),
+        ancestorDescription,
       );
     } else {
-      // Don't transform into consoleWithStackDev here because we add a manual stack.
-      // We use the parent stack here instead of the owner stack because the parent
-      // stack has more useful context for nesting.
-      // TODO: Format this as a linkified "diff view" with props instead of
-      // a stack trace since the stack trace format is now for owner stacks.
-      console['error'](
+      console.error(
         'In HTML, whitespace text nodes cannot be a child of <%s>. ' +
           "Make sure you don't have any extra whitespace between tags on " +
           'each line of your source code.\n' +
           'This will cause a hydration error.%s',
         parentTag,
-        getCurrentParentStackInDev(),
+        ancestorDescription,
       );
     }
     return false;
diff --git a/packages/react-dom/src/__tests__/ReactDOMComponent-test.js b/packages/react-dom/src/__tests__/ReactDOMComponent-test.js
index 6e02e17ece1a7..d37a4ecba6dc6 100644
--- a/packages/react-dom/src/__tests__/ReactDOMComponent-test.js
+++ b/packages/react-dom/src/__tests__/ReactDOMComponent-test.js
@@ -2193,13 +2193,18 @@ describe('ReactDOMComponent', () => {
             </div>,
           );
         });
-      }).toErrorDev([
-        'In HTML, <tr> cannot be a child of ' +
-          '<div>.\n' +
-          'This will cause a hydration error.' +
+      }).toErrorDev(
+        'In HTML, <tr> cannot be a child of <div>.\n' +
+          'This will cause a hydration error.\n' +
+          '\n' +
+          '> <div>\n' +
+          '>   <tr>\n' +
+          '    ...\n' +
           '\n    in tr (at **)' +
-          '\n    in div (at **)',
-      ]);
+          (gate(flags => flags.enableOwnerStacks)
+            ? ''
+            : '\n    in div (at **)'),
+      );
     });
 
     it('warns on invalid nesting at root', async () => {
@@ -2215,12 +2220,13 @@ describe('ReactDOMComponent', () => {
           );
         });
       }).toErrorDev(
-        'In HTML, <p> cannot be a descendant ' +
-          'of <p>.\n' +
+        'In HTML, <p> cannot be a descendant of <p>.\n' +
           'This will cause a hydration error.' +
           // There is no outer `p` here because root container is not part of the stack.
           '\n    in p (at **)' +
-          '\n    in span (at **)',
+          (gate(flags => flags.enableOwnerStacks)
+            ? ''
+            : '\n    in span (at **)'),
       );
     });
 
@@ -2248,29 +2254,90 @@ describe('ReactDOMComponent', () => {
         await act(() => {
           root.render(<Foo />);
         });
-      }).toErrorDev([
-        'In HTML, <tr> cannot be a child of ' +
-          '<table>. Add a <tbody>, <thead> or <tfoot> to your code to match the DOM tree generated ' +
-          'by the browser.\n' +
-          'This will cause a hydration error.' +
-          '\n    in tr (at **)' +
-          '\n    in Row (at **)' +
-          '\n    in table (at **)' +
-          '\n    in Foo (at **)',
-        'In HTML, text nodes cannot be a ' +
-          'child of <tr>.\n' +
-          'This will cause a hydration error.' +
-          '\n    in tr (at **)' +
-          '\n    in Row (at **)' +
-          '\n    in table (at **)' +
-          '\n    in Foo (at **)',
-        'In HTML, whitespace text nodes cannot ' +
-          "be a child of <table>. Make sure you don't have any extra " +
-          'whitespace between tags on each line of your source code.\n' +
-          'This will cause a hydration error.' +
-          '\n    in table (at **)' +
-          '\n    in Foo (at **)',
-      ]);
+      }).toErrorDev(
+        gate(flags => flags.enableOwnerStacks)
+          ? [
+              'In HTML, <tr> cannot be a child of ' +
+                '<table>. Add a <tbody>, <thead> or <tfoot> to your code to match the DOM tree generated ' +
+                'by the browser.\n' +
+                'This will cause a hydration error.\n' +
+                '\n' +
+                '  <Foo>\n' +
+                '>   <table>\n' +
+                '      <Row>\n' +
+                '>       <tr>\n' +
+                '      ...\n' +
+                '\n    in tr (at **)' +
+                '\n    in Row (at **)',
+              '<table> cannot contain a nested <tr>.\nSee this log for the ancestor stack trace.' +
+                '\n    in table (at **)' +
+                '\n    in Foo (at **)',
+              'In HTML, text nodes cannot be a ' +
+                'child of <tr>.\n' +
+                'This will cause a hydration error.\n' +
+                '\n' +
+                '  <Foo>\n' +
+                '    <table>\n' +
+                '      <Row>\n' +
+                '        <tr>\n' +
+                '>         x\n' +
+                '      ...\n' +
+                '\n    in tr (at **)' +
+                '\n    in Row (at **)',
+              'In HTML, whitespace text nodes cannot ' +
+                "be a child of <table>. Make sure you don't have any extra " +
+                'whitespace between tags on each line of your source code.\n' +
+                'This will cause a hydration error.\n' +
+                '\n' +
+                '  <Foo>\n' +
+                '>   <table>\n' +
+                '      <Row>\n' +
+                '>     {" "}\n' +
+                '\n    in table (at **)' +
+                '\n    in Foo (at **)',
+            ]
+          : [
+              'In HTML, <tr> cannot be a child of ' +
+                '<table>. Add a <tbody>, <thead> or <tfoot> to your code to match the DOM tree generated ' +
+                'by the browser.\n' +
+                'This will cause a hydration error.\n' +
+                '\n' +
+                '  <Foo>\n' +
+                '>   <table>\n' +
+                '      <Row>\n' +
+                '>       <tr>\n' +
+                '      ...\n' +
+                '\n    in tr (at **)' +
+                '\n    in Row (at **)' +
+                '\n    in table (at **)' +
+                '\n    in Foo (at **)',
+              'In HTML, text nodes cannot be a ' +
+                'child of <tr>.\n' +
+                'This will cause a hydration error.\n' +
+                '\n' +
+                '  <Foo>\n' +
+                '    <table>\n' +
+                '      <Row>\n' +
+                '        <tr>\n' +
+                '>         x\n' +
+                '      ...\n' +
+                '\n    in tr (at **)' +
+                '\n    in Row (at **)' +
+                '\n    in table (at **)' +
+                '\n    in Foo (at **)',
+              'In HTML, whitespace text nodes cannot ' +
+                "be a child of <table>. Make sure you don't have any extra " +
+                'whitespace between tags on each line of your source code.\n' +
+                'This will cause a hydration error.\n' +
+                '\n' +
+                '  <Foo>\n' +
+                '>   <table>\n' +
+                '      <Row>\n' +
+                '>     {" "}\n' +
+                '\n    in table (at **)' +
+                '\n    in Foo (at **)',
+            ],
+      );
     });
 
     it('warns nicely for updating table rows to use text', async () => {
@@ -2297,7 +2364,11 @@ describe('ReactDOMComponent', () => {
         'In HTML, whitespace text nodes cannot ' +
           "be a child of <table>. Make sure you don't have any extra " +
           'whitespace between tags on each line of your source code.\n' +
-          'This will cause a hydration error.' +
+          'This will cause a hydration error.\n' +
+          '\n' +
+          '  <Foo>\n' +
+          '    <table>\n' +
+          '>     {" "}\n' +
           '\n    in table (at **)' +
           '\n    in Foo (at **)',
       ]);
@@ -2325,12 +2396,21 @@ describe('ReactDOMComponent', () => {
       }).toErrorDev([
         'In HTML, text nodes cannot be a ' +
           'child of <tr>.\n' +
-          'This will cause a hydration error.' +
+          'This will cause a hydration error.\n' +
+          '\n' +
+          '  <Foo>\n' +
+          '    <table>\n' +
+          '      <tbody>\n' +
+          '        <Row>\n' +
+          '          <tr>\n' +
+          '>           text\n' +
           '\n    in tr (at **)' +
           '\n    in Row (at **)' +
-          '\n    in tbody (at **)' +
-          '\n    in table (at **)' +
-          '\n    in Foo (at **)',
+          (gate(flags => flags.enableOwnerStacks)
+            ? ''
+            : '\n    in tbody (at **)' +
+              '\n    in table (at **)' +
+              '\n    in Foo (at **)'),
       ]);
     });
 
@@ -2359,11 +2439,21 @@ describe('ReactDOMComponent', () => {
           root.render(<App1 />);
         });
       }).toErrorDev(
-        '\n    in tr (at **)' +
-          '\n    in Row (at **)' +
-          '\n    in FancyRow (at **)' +
-          '\n    in table (at **)' +
-          '\n    in Viz1 (at **)',
+        gate(flags => flags.enableOwnerStacks)
+          ? [
+              '\n    in tr (at **)' +
+                '\n    in Row (at **)' +
+                '\n    in FancyRow (at **)' +
+                '\n    in Viz1 (at **)',
+              '\n    in table (at **)' + '\n    in Viz1 (at **)',
+            ]
+          : [
+              '\n    in tr (at **)' +
+                '\n    in Row (at **)' +
+                '\n    in FancyRow (at **)' +
+                '\n    in table (at **)' +
+                '\n    in Viz1 (at **)',
+            ],
       );
     });
 
@@ -2405,13 +2495,26 @@ describe('ReactDOMComponent', () => {
           root.render(<App2 />);
         });
       }).toErrorDev(
-        '\n    in tr (at **)' +
-          '\n    in Row (at **)' +
-          '\n    in FancyRow (at **)' +
-          '\n    in table (at **)' +
-          '\n    in Table (at **)' +
-          '\n    in FancyTable (at **)' +
-          '\n    in Viz2 (at **)',
+        gate(flags => flags.enableOwnerStacks)
+          ? [
+              '\n    in tr (at **)' +
+                '\n    in Row (at **)' +
+                '\n    in FancyRow (at **)' +
+                '\n    in Viz2 (at **)',
+              '\n    in table (at **)' +
+                '\n    in Table (at **)' +
+                '\n    in FancyTable (at **)' +
+                '\n    in Viz2 (at **)',
+            ]
+          : [
+              '\n    in tr (at **)' +
+                '\n    in Row (at **)' +
+                '\n    in FancyRow (at **)' +
+                '\n    in table (at **)' +
+                '\n    in Table (at **)' +
+                '\n    in FancyTable (at **)' +
+                '\n    in Viz2 (at **)',
+            ],
       );
     });
 
@@ -2446,12 +2549,23 @@ describe('ReactDOMComponent', () => {
           );
         });
       }).toErrorDev(
-        '\n    in tr (at **)' +
-          '\n    in Row (at **)' +
-          '\n    in FancyRow (at **)' +
-          '\n    in table (at **)' +
-          '\n    in Table (at **)' +
-          '\n    in FancyTable (at **)',
+        gate(flags => flags.enableOwnerStacks)
+          ? [
+              '\n    in tr (at **)' +
+                '\n    in Row (at **)' +
+                '\n    in FancyRow (at **)',
+              '\n    in table (at **)' +
+                '\n    in Table (at **)' +
+                '\n    in FancyTable (at **)',
+            ]
+          : [
+              '\n    in tr (at **)' +
+                '\n    in Row (at **)' +
+                '\n    in FancyRow (at **)' +
+                '\n    in table (at **)' +
+                '\n    in Table (at **)' +
+                '\n    in FancyTable (at **)',
+            ],
       );
     });
 
@@ -2475,10 +2589,19 @@ describe('ReactDOMComponent', () => {
           );
         });
       }).toErrorDev(
-        '\n    in tr (at **)' +
-          '\n    in Row (at **)' +
-          '\n    in FancyRow (at **)' +
-          '\n    in table (at **)',
+        gate(flags => flags.enableOwnerStacks)
+          ? [
+              '\n    in tr (at **)' +
+                '\n    in Row (at **)' +
+                '\n    in FancyRow (at **)',
+              '\n    in table (at **)',
+            ]
+          : [
+              '\n    in tr (at **)' +
+                '\n    in Row (at **)' +
+                '\n    in FancyRow (at **)' +
+                '\n    in table (at **)',
+            ],
       );
     });
 
@@ -2506,10 +2629,19 @@ describe('ReactDOMComponent', () => {
           );
         });
       }).toErrorDev(
-        '\n    in tr (at **)' +
-          '\n    in table (at **)' +
-          '\n    in Table (at **)' +
-          '\n    in FancyTable (at **)',
+        gate(flags => flags.enableOwnerStacks)
+          ? [
+              '\n    in tr (at **)',
+              '\n    in table (at **)' +
+                '\n    in Table (at **)' +
+                '\n    in FancyTable (at **)',
+            ]
+          : [
+              '\n    in tr (at **)' +
+                '\n    in table (at **)' +
+                '\n    in Table (at **)' +
+                '\n    in FancyTable (at **)',
+            ],
       );
 
       class Link extends React.Component {
@@ -2531,11 +2663,18 @@ describe('ReactDOMComponent', () => {
           );
         });
       }).toErrorDev(
-        '\n    in a (at **)' +
-          '\n    in Link (at **)' +
-          '\n    in div (at **)' +
-          '\n    in a (at **)' +
-          '\n    in Link (at **)',
+        gate(flags => flags.enableOwnerStacks)
+          ? [
+              '\n    in a (at **)' + '\n    in Link (at **)',
+              '\n    in a (at **)' + '\n    in Link (at **)',
+            ]
+          : [
+              '\n    in a (at **)' +
+                '\n    in Link (at **)' +
+                '\n    in div (at **)' +
+                '\n    in a (at **)' +
+                '\n    in Link (at **)',
+            ],
       );
     });
 
diff --git a/packages/react-dom/src/__tests__/ReactDOMForm-test.js b/packages/react-dom/src/__tests__/ReactDOMForm-test.js
index 4c3ebecccb1e9..7ba4bea06bacf 100644
--- a/packages/react-dom/src/__tests__/ReactDOMForm-test.js
+++ b/packages/react-dom/src/__tests__/ReactDOMForm-test.js
@@ -385,12 +385,16 @@ describe('ReactDOMForm', () => {
           </form>,
         );
       });
-    }).toErrorDev([
+    }).toErrorDev(
       'In HTML, <form> cannot be a descendant of <form>.\n' +
-        'This will cause a hydration error.' +
+        'This will cause a hydration error.\n' +
+        '\n' +
+        '> <form action={function outerAction}>\n' +
+        '    <input>\n' +
+        '>   <form action={function innerAction} ref={{current:null}}>\n' +
         '\n    in form (at **)' +
-        '\n    in form (at **)',
-    ]);
+        (gate(flags => flags.enableOwnerStacks) ? '' : '\n    in form (at **)'),
+    );
 
     await submit(ref.current);
 
diff --git a/packages/react-dom/src/__tests__/ReactDOMOption-test.js b/packages/react-dom/src/__tests__/ReactDOMOption-test.js
index dab7f69b27e22..ce5e3c65bcfdb 100644
--- a/packages/react-dom/src/__tests__/ReactDOMOption-test.js
+++ b/packages/react-dom/src/__tests__/ReactDOMOption-test.js
@@ -53,8 +53,15 @@ describe('ReactDOMOption', () => {
     }).toErrorDev(
       'In HTML, <div> cannot be a child of <option>.\n' +
         'This will cause a hydration error.\n' +
-        '    in div (at **)\n' +
-        '    in option (at **)',
+        '\n' +
+        '> <option value="12">\n' +
+        '>   <div>\n' +
+        '    ...\n' +
+        '\n' +
+        '    in div (at **)' +
+        (gate(flags => flags.enableOwnerStacks)
+          ? ''
+          : '\n    in option (at **)'),
     );
     expect(container.firstChild.innerHTML).toBe('1 <div></div> 2');
     await renderIntoDocument(el);
@@ -266,7 +273,20 @@ describe('ReactDOMOption', () => {
           onRecoverableError: () => {},
         });
       });
-    }).toErrorDev(['In HTML, <div> cannot be a child of <option>']);
+    }).toErrorDev(
+      'In HTML, <div> cannot be a child of <option>.\n' +
+        'This will cause a hydration error.\n' +
+        '\n' +
+        '  <select readOnly={true} value="bar">\n' +
+        '>   <option value="bar">\n' +
+        '>     <div ref={{current:null}}>\n' +
+        '      ...\n' +
+        '\n' +
+        '    in div (at **)' +
+        (gate(flags => flags.enableOwnerStacks)
+          ? ''
+          : '\n    in option (at **)'),
+    );
     option = container.firstChild.firstChild;
 
     expect(option.textContent).toBe('BarFooBaz');
diff --git a/packages/react-dom/src/__tests__/validateDOMNesting-test.js b/packages/react-dom/src/__tests__/validateDOMNesting-test.js
index 4690ba09c74e4..6d393e9ff42e9 100644
--- a/packages/react-dom/src/__tests__/validateDOMNesting-test.js
+++ b/packages/react-dom/src/__tests__/validateDOMNesting-test.js
@@ -93,14 +93,34 @@ describe('validateDOMNesting', () => {
     );
     expectWarnings(
       ['div', 'ul', 'li', 'div', 'li'],
-      [
-        'In HTML, <li> cannot be a descendant of <li>.\n' +
-          'This will cause a hydration error.\n' +
-          '    in li (at **)\n' +
-          '    in div (at **)\n' +
-          '    in li (at **)\n' +
-          '    in ul (at **)',
-      ],
+      gate(flags => flags.enableOwnerStacks)
+        ? [
+            'In HTML, <li> cannot be a descendant of <li>.\n' +
+              'This will cause a hydration error.\n' +
+              '\n' +
+              '  <ul>\n' +
+              '>   <li>\n' +
+              '      <div>\n' +
+              '>       <li>\n' +
+              '\n' +
+              '    in li (at **)',
+            '<li> cannot contain a nested <li>.\nSee this log for the ancestor stack trace.\n' +
+              '    in li (at **)',
+          ]
+        : [
+            'In HTML, <li> cannot be a descendant of <li>.\n' +
+              'This will cause a hydration error.\n' +
+              '\n' +
+              '  <ul>\n' +
+              '>   <li>\n' +
+              '      <div>\n' +
+              '>       <li>\n' +
+              '\n' +
+              '    in li (at **)\n' +
+              '    in div (at **)\n' +
+              '    in li (at **)\n' +
+              '    in ul (at **)',
+          ],
     );
     expectWarnings(
       ['div', 'html'],
@@ -120,15 +140,32 @@ describe('validateDOMNesting', () => {
     );
     expectWarnings(
       ['svg', 'foreignObject', 'body', 'p'],
-      [
-        // TODO, this should say "In SVG",
-        'In HTML, <body> cannot be a child of <foreignObject>.\n' +
-          'This will cause a hydration error.\n' +
-          '    in body (at **)\n' +
-          '    in foreignObject (at **)',
-        'You are mounting a new body component when a previous one has not first unmounted. It is an error to render more than one body component at a time and attributes and children of these components will likely fail in unpredictable ways. Please only render a single instance of <body> and if you need to mount a new one, ensure any previous ones have unmounted first.\n' +
-          '    in body (at **)',
-      ],
+      gate(flags => flags.enableOwnerStacks)
+        ? [
+            // TODO, this should say "In SVG",
+            'In HTML, <body> cannot be a child of <foreignObject>.\n' +
+              'This will cause a hydration error.\n' +
+              '\n' +
+              '> <foreignObject>\n' +
+              '>   <body>\n' +
+              '\n' +
+              '    in body (at **)',
+            'You are mounting a new body component when a previous one has not first unmounted. It is an error to render more than one body component at a time and attributes and children of these components will likely fail in unpredictable ways. Please only render a single instance of <body> and if you need to mount a new one, ensure any previous ones have unmounted first.\n' +
+              '    in body (at **)',
+          ]
+        : [
+            // TODO, this should say "In SVG",
+            'In HTML, <body> cannot be a child of <foreignObject>.\n' +
+              'This will cause a hydration error.\n' +
+              '\n' +
+              '> <foreignObject>\n' +
+              '>   <body>\n' +
+              '\n' +
+              '    in body (at **)\n' +
+              '    in foreignObject (at **)',
+            'You are mounting a new body component when a previous one has not first unmounted. It is an error to render more than one body component at a time and attributes and children of these components will likely fail in unpredictable ways. Please only render a single instance of <body> and if you need to mount a new one, ensure any previous ones have unmounted first.\n' +
+              '    in body (at **)',
+          ],
     );
   });
 });
diff --git a/packages/react-reconciler/src/ReactChildFiber.js b/packages/react-reconciler/src/ReactChildFiber.js
index 10edf8537a53f..d4cf9db2d9c19 100644
--- a/packages/react-reconciler/src/ReactChildFiber.js
+++ b/packages/react-reconciler/src/ReactChildFiber.js
@@ -514,6 +514,11 @@ function createChildReconciler(
       const created = createFiberFromText(textContent, returnFiber.mode, lanes);
       created.return = returnFiber;
       if (__DEV__) {
+        // We treat the parent as the owner for stack purposes.
+        created._debugOwner = returnFiber;
+        if (enableOwnerStacks) {
+          created._debugTask = returnFiber._debugTask;
+        }
         created._debugInfo = currentDebugInfo;
       }
       return created;
@@ -630,6 +635,11 @@ function createChildReconciler(
       );
       created.return = returnFiber;
       if (__DEV__) {
+        // We treat the parent as the owner for stack purposes.
+        created._debugOwner = returnFiber;
+        if (enableOwnerStacks) {
+          created._debugTask = returnFiber._debugTask;
+        }
         created._debugInfo = currentDebugInfo;
       }
       return created;
@@ -665,6 +675,11 @@ function createChildReconciler(
       );
       created.return = returnFiber;
       if (__DEV__) {
+        // We treat the parent as the owner for stack purposes.
+        created._debugOwner = returnFiber;
+        if (enableOwnerStacks) {
+          created._debugTask = returnFiber._debugTask;
+        }
         created._debugInfo = currentDebugInfo;
       }
       return created;
@@ -729,6 +744,11 @@ function createChildReconciler(
         );
         created.return = returnFiber;
         if (__DEV__) {
+          // We treat the parent as the owner for stack purposes.
+          created._debugOwner = returnFiber;
+          if (enableOwnerStacks) {
+            created._debugTask = returnFiber._debugTask;
+          }
           const prevDebugInfo = pushDebugInfo(newChild._debugInfo);
           created._debugInfo = currentDebugInfo;
           currentDebugInfo = prevDebugInfo;
@@ -1610,6 +1630,14 @@ function createChildReconciler(
     deleteRemainingChildren(returnFiber, currentFirstChild);
     const created = createFiberFromText(textContent, returnFiber.mode, lanes);
     created.return = returnFiber;
+    if (__DEV__) {
+      // We treat the parent as the owner for stack purposes.
+      created._debugOwner = returnFiber;
+      if (enableOwnerStacks) {
+        created._debugTask = returnFiber._debugTask;
+      }
+      created._debugInfo = currentDebugInfo;
+    }
     return created;
   }
 
@@ -1683,6 +1711,11 @@ function createChildReconciler(
       );
       created.return = returnFiber;
       if (__DEV__) {
+        // We treat the parent as the owner for stack purposes.
+        created._debugOwner = returnFiber;
+        if (enableOwnerStacks) {
+          created._debugTask = returnFiber._debugTask;
+        }
         created._debugInfo = currentDebugInfo;
       }
       validateFragmentProps(element, created, returnFiber);
diff --git a/packages/react-reconciler/src/ReactCurrentFiber.js b/packages/react-reconciler/src/ReactCurrentFiber.js
index c73a997d48cff..29431a8a0aa03 100644
--- a/packages/react-reconciler/src/ReactCurrentFiber.js
+++ b/packages/react-reconciler/src/ReactCurrentFiber.js
@@ -33,17 +33,6 @@ export function getCurrentFiberOwnerNameInDevOrNull(): string | null {
   return null;
 }
 
-export function getCurrentParentStackInDev(): string {
-  // This is used to get the parent stack even with owner stacks turned on.
-  if (__DEV__) {
-    if (current === null) {
-      return '';
-    }
-    return getStackByFiberInDevAndProd(current);
-  }
-  return '';
-}
-
 function getCurrentFiberStackInDev(stack: null | Error): string {
   if (__DEV__) {
     if (current === null) {
diff --git a/packages/react-reconciler/src/ReactFiberHydrationDiffs.js b/packages/react-reconciler/src/ReactFiberHydrationDiffs.js
index 021da8abf33f1..1e37e041e2bf6 100644
--- a/packages/react-reconciler/src/ReactFiberHydrationDiffs.js
+++ b/packages/react-reconciler/src/ReactFiberHydrationDiffs.js
@@ -101,7 +101,7 @@ function describeFiberType(fiber: Fiber): null | string {
   }
 }
 
-const needsEscaping = /["'&<>\n\t]/;
+const needsEscaping = /["'&<>\n\t]|^\s|\s$/;
 
 function describeTextNode(content: string, maxLength: number): string {
   if (needsEscaping.test(content)) {
@@ -498,9 +498,15 @@ function describeElementDiff(
     typeof clientChildren === 'number' ||
     typeof clientChildren === 'bigint'
   ) {
-    // The client has children but it's not considered a difference from the server.
-    // $FlowFixMe[unsafe-addition]
-    content += describeTextDiff('' + clientChildren, undefined, indent + 1);
+    if (serverChildren == null) {
+      // This is a new string child.
+      // $FlowFixMe[unsafe-addition]
+      content += describeTextDiff('' + clientChildren, null, indent + 1);
+    } else {
+      // The client has children but it's not considered a difference from the server.
+      // $FlowFixMe[unsafe-addition]
+      content += describeTextDiff('' + clientChildren, undefined, indent + 1);
+    }
   }
   return content;
 }
@@ -554,6 +560,7 @@ function describeNode(node: HydrationDiffNode, indent: number): string {
   if (node.fiber.tag === HostText) {
     // Text Node
     selfContent = describeTextDiff(clientProps, node.serverProps, indent);
+    indent++;
   } else {
     const type = describeFiberType(node.fiber);
     if (type !== null) {
@@ -564,9 +571,7 @@ function describeNode(node: HydrationDiffNode, indent: number): string {
         indent++;
       } else if (node.serverProps === null) {
         selfContent = describeExpandedElement(type, clientProps, added(indent));
-        // If this was an insertion we won't step down further. Any tail
-        // are considered siblings so we don't indent.
-        // TODO: Model this a little better.
+        indent++;
       } else if (typeof node.serverProps === 'string') {
         if (__DEV__) {
           console.error(
@@ -611,6 +616,9 @@ function describeNode(node: HydrationDiffNode, indent: number): string {
 
   // Deleted tail nodes
   const serverTail = node.serverTail;
+  if (node.serverProps === null) {
+    indent--;
+  }
   for (let i = 0; i < serverTail.length; i++) {
     const tailNode = serverTail[i];
     if (typeof tailNode === 'string') {