fix: updates background component to merge props

imgix · Dec 5, 2023 · 048b4fd · 048b4fd
1 parent d6af82d
commit 048b4fd
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 10 deletions.
diff --git a/src/react-imgix-bg.jsx b/src/react-imgix-bg.jsx
@@ -182,7 +182,6 @@ class BackgroundImpl extends React.Component {
           : "cover",
     };
 
-    // Focus here
     return (
       <div {...commonProps} className={className} ref={onRef} style={style}>
         {children}

diff --git a/test/unit/imgix-provider.test.jsx b/test/unit/imgix-provider.test.jsx
@@ -1,6 +1,6 @@
 import { mount, shallow } from "enzyme";
 import React from "react";
-import ReactImgix, { ImgixProvider } from "../../src/index";
+import ReactImgix, { ImgixProvider, Background } from "../../src/index";
 
 const providerProps = {
   domain: "sdk-test.imgix.net",
@@ -17,15 +17,22 @@ describe("ImgixProvider", () => {
     const wrappedComponent = (
       <ImgixProvider>
         <ReactImgix {...imageProps} />
+        <Background {...imageProps} />
       </ImgixProvider>
     );
 
     const expectedProps = {
       children: (
-        <ReactImgix
-          src="https://assets.imgix.net/examples/pione.jpg"
-          sizes="50vw"
-        />
+        <>
+          <ReactImgix
+            src="https://assets.imgix.net/examples/pione.jpg"
+            sizes="50vw"
+          />
+          <Background
+            src="https://assets.imgix.net/examples/pione.jpg"
+            sizes="50vw"
+          />
+        </>
       ),
       value: {},
     };
@@ -38,16 +45,23 @@ describe("ImgixProvider", () => {
     const wrappedComponent = (
       <ImgixProvider {...providerProps}>
         <ReactImgix {...imageProps} />
+        <Background {...imageProps} />
       </ImgixProvider>
     );
 
     // ensure Provider value correctly set
     const expectedProps = {
       children: (
-        <ReactImgix
-          src="https://assets.imgix.net/examples/pione.jpg"
-          sizes="50vw"
-        />
+        <>
+          <ReactImgix
+            src="https://assets.imgix.net/examples/pione.jpg"
+            sizes="50vw"
+          />
+          <Background
+            src="https://assets.imgix.net/examples/pione.jpg"
+            sizes="50vw"
+          />
+        </>
       ),
       value: { domain: "sdk-test.imgix.net", sizes: "100vw" },
     };
@@ -66,6 +80,7 @@ describe("ImgixProvider", () => {
     const wrappedComponent = (
       <ImgixProvider {...providerProps}>
         <ReactImgix {...modifiedProps} />
+        <Background {...modifiedProps} />
       </ImgixProvider>
     );