[⏪ Reverted] fix(PageLayout): Remove warning for the deprecated position prop

src/PageLayout/PageLayout.tsx

@@ -482,6 +482,9 @@ Content.displayName = 'PageLayout.Content'
 // PageLayout.Pane
 
 export type PageLayoutPaneProps = {
+  /**
+   * @deprecated position the pane by ordering your markup instead.
+   */
   position?: keyof typeof panePositions | ResponsiveValue<keyof typeof panePositions>
   /**
    * @deprecated Use the `position` prop with a responsive value instead.
@@ -563,11 +566,16 @@ const Pane = React.forwardRef<HTMLDivElement, React.PropsWithChildren<PageLayout
     },
     forwardRef,
   ) => {
-    if (responsivePosition !== undefined) {
-      // eslint-disable-next-line no-console
-      console.warn(
-        'The `position` prop will be removed on the next major version. You should order your markup as you want it to render instead.',
-      )
+    if (__DEV__ && process.env.NODE_ENV !== 'test') {
+      // We don't want these warnings to show up on tests because it fails the tests (at dotcom) due to not extecting a warning.
+      // Practically, this is not a conditional hook, it is just making sure this hook runs only on DEV not PROD.
+      // eslint-disable-next-line react-hooks/rules-of-hooks
+      React.useEffect(() => {
+        warning(
+          responsivePosition !== undefined,
+          'The `position` prop will be removed on the next major version. You should order your markup as you want it to render instead.',
+        )
+      }, [responsivePosition])
     }
 
     // Combine position and positionWhenNarrow for backwards compatibility

src/SplitPageLayout/SplitPageLayout.test.tsx

@@ -17,7 +17,8 @@ describe('SplitPageLayout', () => {
   })
 
   it('renders default layout', () => {
-    const spy = jest.spyOn(console, 'warn').mockImplementation(() => {})
+    // Disabling them for now because we are not expecting them in the tests.
+    // const spy = jest.spyOn(console, 'warn').mockImplementation(() => {})
     const {container} = render(
       <ThemeProvider>
         <SplitPageLayout>
@@ -28,21 +29,22 @@ describe('SplitPageLayout', () => {
         </SplitPageLayout>
       </ThemeProvider>,
     )
-    expect(spy).toHaveBeenCalled()
+    // expect(spy).toHaveBeenCalled()
 
     expect(container).toMatchSnapshot()
   })
 
   it('renders Pane with a custom ID', () => {
-    const spy = jest.spyOn(console, 'warn').mockImplementation(() => {})
+    // Disabling them for now because we are not expecting them in the tests.
+    // const spy = jest.spyOn(console, 'warn').mockImplementation(() => {})
     const {getByText} = render(
       <ThemeProvider>
         <SplitPageLayout>
           <SplitPageLayout.Pane id="customId">Pane Content</SplitPageLayout.Pane>
         </SplitPageLayout>
       </ThemeProvider>,
     )
-    expect(spy).toHaveBeenCalled()
+    // expect(spy).toHaveBeenCalled()
 
     const pane = getByText('Pane Content')