chore: back of missing preview.rootClassName (#384)

Author: zombieJ

src/Image.tsx

@@ -119,6 +119,7 @@ const ImageInternal: CompoundedComponent<ImageProps> = props => {
     cover,
     classNames: previewClassNames = {},
     styles: previewStyles = {},
+    rootClassName: previewRootClassName,
     ...restProps
   }: PreviewConfig = preview && typeof preview === 'object' ? preview : {};
 
@@ -262,7 +263,7 @@ const ImageInternal: CompoundedComponent<ImageProps> = props => {
           imgCommonProps={imgCommonProps}
           classNames={previewClassNames}
           styles={previewStyles}
-          rootClassName={rootClassName}
+          rootClassName={classnames(previewRootClassName, rootClassName)}
           {...restProps}
         />
       )}

src/Preview/index.tsx

@@ -68,6 +68,8 @@ export type ToolbarRenderInfoType = {
 
 export interface InternalPreviewConfig {
   // Semantic
+  /** Better to use `classNames.root` instead */
+  rootClassName?: string;
   classNames?: Partial<Record<InternalPreviewSemanticName, string>>;
   styles?: Partial<Record<InternalPreviewSemanticName, React.CSSProperties>>;
 
@@ -108,7 +110,6 @@ export interface InternalPreviewConfig {
 export interface PreviewProps extends InternalPreviewConfig {
   // Misc
   prefixCls: string;
-  rootClassName?: string;
 
   // Origin image Info
   imageInfo?: {

tests/preview.test.tsx

@@ -643,7 +643,7 @@ describe('Preview', () => {
 
   it('Customize preview props', () => {
     const src = 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png';
-    const { container } = render(
+    render(
       <Image
         src={src}
         preview={{
@@ -712,6 +712,21 @@ describe('Preview', () => {
     expect(document.querySelectorAll('.custom-className')).toHaveLength(2);
   });
 
+  it('preview.rootClassName should be correct', () => {
+    const src = 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png';
+    render(
+      <Image
+        src={src}
+        preview={{
+          open: true,
+          rootClassName: 'custom-className',
+        }}
+      />,
+    );
+
+    expect(document.querySelector('.rc-image-preview.custom-className')).toBeTruthy();
+  });
+
   it('if async src set should be correct', () => {
     const src =
       'https://gw.alipayobjects.com/mdn/rms_08e378/afts/img/A*P0S-QIRUbsUAAAAAAAAAAABkARQnAQ';