chore: fixed rounded prop and added tests to datepicker

button-inc · Oct 27, 2022 · 1300038 · 1300038
1 parent 750f425
commit 1300038
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 1 deletion.
diff --git a/packages/button-theme/__tests__/DatePicker.test.tsx b/packages/button-theme/__tests__/DatePicker.test.tsx
@@ -1,9 +1,10 @@
 import { axe, toHaveNoViolations } from 'jest-axe';
 import { render } from '@testing-library/react';
 import React from 'react';
-import DatePicker from '../src/DatePicker';
+import DatePicker, { datepickerStyles } from '../src/DatePicker';
 import '@testing-library/jest-dom/extend-expect';
 import 'regenerator-runtime/runtime';
+import { changeSelectorToObject } from '../../bcgov-theme/utils/test-helpers';
 
 expect.extend(toHaveNoViolations);
 
@@ -14,4 +15,11 @@ describe('DatePicker', () => {
 
     expect(results).toHaveNoViolations();
   });
+
+  it('Should apply styles from props', () => {
+    render(<DatePicker id="test" rounded />);
+    const datepicker = document.getElementById('test');
+    const stylesObject = changeSelectorToObject(datepickerStyles.rounded.input);
+    expect(datepicker).toHaveStyle(stylesObject.base);
+  });
 });
diff --git a/packages/button-theme/src/DatePicker.tsx b/packages/button-theme/src/DatePicker.tsx
@@ -41,6 +41,11 @@ export const datepickerStyles = {
       `,
     },
   },
+  rounded: {
+    input: `
+      border-radius: 0.25em;
+    `,
+  },
 };
 
 const config: StyleConfig = {