Update test

Author: chazdean

polaris-react/src/components/Inline/tests/Inline.test.tsx

@@ -17,4 +17,49 @@ describe('<Inline />', () => {
 
     expect(stack).toContainReactText(childText);
   });
+
+  it('renders custom properties by default', () => {
+    const stack = mountWithApp(<Inline>{renderChildren()}</Inline>);
+
+    expect(stack).toContainReactComponent('div', {
+      style: expect.objectContaining({
+        '--pc-inline-align': 'start',
+        '--pc-inline-block-align': 'center',
+        '--pc-inline-wrap': 'wrap',
+      }) as React.CSSProperties,
+    });
+  });
+
+  it('overrides custom properties if they are passed in', () => {
+    const stack = mountWithApp(
+      <Inline align="center" blockAlign="start" gap="10">
+        {renderChildren()}
+      </Inline>,
+    );
+
+    expect(stack).toContainReactComponent('div', {
+      style: expect.objectContaining({
+        '--pc-inline-align': 'center',
+        '--pc-inline-block-align': 'start',
+        '--pc-inline-wrap': 'wrap',
+        '--pc-inline-gap-xs': 'var(--p-space-10)',
+      }) as React.CSSProperties,
+    });
+  });
+
+  it('accepts gap based on breakpoints', () => {
+    const stack = mountWithApp(
+      <Inline gap={{xs: '2', md: '8'}}>{renderChildren()}</Inline>,
+    );
+
+    expect(stack).toContainReactComponent('div', {
+      style: expect.objectContaining({
+        '--pc-inline-align': 'start',
+        '--pc-inline-block-align': 'center',
+        '--pc-inline-wrap': 'wrap',
+        '--pc-inline-gap-xs': 'var(--p-space-2)',
+        '--pc-inline-gap-md': 'var(--p-space-8)',
+      }) as React.CSSProperties,
+    });
+  });
 });