chore: Add warning if use inlineCollapsed under Sider (#16826)

components/layout/__tests__/index.test.js

@@ -138,7 +138,17 @@ describe('Layout', () => {
   });
 });
 
-describe('Sider onBreakpoint', () => {
+describe('Sider', () => {
+  const errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
+
+  afterEach(() => {
+    errorSpy.mockReset();
+  });
+
+  afterAll(() => {
+    errorSpy.mockRestore();
+  });
+
   beforeAll(() => {
     Object.defineProperty(window, 'matchMedia', {
       value: jest.fn(() => ({
@@ -159,4 +169,15 @@ describe('Sider onBreakpoint', () => {
     );
     expect(onBreakpoint).toHaveBeenCalledWith(true);
   });
+
+  it('should warning if use `inlineCollapsed` with menu', () => {
+    mount(
+      <Sider collapsible>
+        <Menu mode="inline" inlineCollapsed />
+      </Sider>,
+    );
+    expect(errorSpy).toHaveBeenCalledWith(
+      'Warning: [antd: Menu] `inlineCollapsed` not control Menu under Sider. Should set `collapsed` on Sider instead.',
+    );
+  });
 });

components/menu/index.tsx

@@ -142,6 +142,12 @@ class InternalMenu extends React.Component<InternalMenuProps, MenuState> {
       '`inlineCollapsed` should only be used when `mode` is inline.',
     );
 
+    warning(
+      !(props.siderCollapsed !== undefined && 'inlineCollapsed' in props),
+      'Menu',
+      '`inlineCollapsed` not control Menu under Sider. Should set `collapsed` on Sider instead.',
+    );
+
     let openKeys;
     if ('openKeys' in props) {
       openKeys = props.openKeys;