From deff86a5cba322efc7bf09b90ae01429577807d8 Mon Sep 17 00:00:00 2001
From: Gavin Henderson <gavin.henderson@hotmail.co.uk>
Date: Fri, 30 Jul 2021 14:00:23 +0100
Subject: [PATCH 1/2] Switch to nullish coalescing
---
src/components/AccordionItem.tsx | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/src/components/AccordionItem.tsx b/src/components/AccordionItem.tsx
index 35ad7df..3a719f1 100644
--- a/src/components/AccordionItem.tsx
+++ b/src/components/AccordionItem.tsx
@@ -24,7 +24,7 @@ const AccordionItem = ({
...rest
}: Props): JSX.Element => {
const [instanceUuid] = useState<UUID>(nextUuid());
- const uuid = customUuid || instanceUuid;
+ const uuid = customUuid ?? instanceUuid;
const renderChildren = (itemContext: ItemContext): JSX.Element => {
const { expanded } = itemContext;
From 980d745381a13d7203f1cfc44757f5393560fd42 Mon Sep 17 00:00:00 2001
From: Gavin Henderson <gavin.henderson@hotmail.co.uk>
Date: Fri, 30 Jul 2021 14:39:32 +0100
Subject: [PATCH 2/2] Add a regression test and update types
---
src/components/AccordionItem.spec.tsx | 28 ++++++++++++++++++++++++++-
src/components/AccordionItem.tsx | 2 +-
src/components/ItemContext.tsx | 2 +-
3 files changed, 29 insertions(+), 3 deletions(-)
diff --git a/src/components/AccordionItem.spec.tsx b/src/components/AccordionItem.spec.tsx
index 30eb3e4..49f0099 100644
--- a/src/components/AccordionItem.spec.tsx
+++ b/src/components/AccordionItem.spec.tsx
@@ -1,7 +1,8 @@
-import { cleanup, render } from '@testing-library/react';
+import { cleanup, render, fireEvent } from '@testing-library/react';
import * as React from 'react';
import { default as Accordion } from './Accordion';
import AccordionItem from './AccordionItem';
+import AccordionItemButton from './AccordionItemButton';
enum UUIDS {
FOO = 'FOO',
@@ -74,4 +75,29 @@ describe('AccordionItem', () => {
expect(getByText('Hello World')).toBeTruthy();
});
});
+
+ describe('uuid prop', () => {
+ it('keeps the uuid as 0 even though its falsy', () => {
+ const testId = 'el-with-zero-uuid';
+ const zero = 0;
+ let selected: (string | number)[] = [];
+ const { getByTestId } = render(
+ <Accordion
+ onChange={(latestSelected) => {
+ selected = latestSelected;
+ }}
+ >
+ <AccordionItem uuid={zero}>
+ <AccordionItemButton data-testid={testId}>
+ Click me
+ </AccordionItemButton>
+ </AccordionItem>
+ </Accordion>,
+ );
+
+ fireEvent.click(getByTestId(testId));
+
+ expect(selected).toEqual([zero]);
+ });
+ });
});
diff --git a/src/components/AccordionItem.tsx b/src/components/AccordionItem.tsx
index 3a719f1..3f593a2 100644
--- a/src/components/AccordionItem.tsx
+++ b/src/components/AccordionItem.tsx
@@ -39,7 +39,7 @@ const AccordionItem = ({
);
};
- assertValidHtmlId(uuid);
+ assertValidHtmlId(uuid.toString());
if (rest.id) {
assertValidHtmlId(rest.id);
}
diff --git a/src/components/ItemContext.tsx b/src/components/ItemContext.tsx
index 0e109db..42d9379 100644
--- a/src/components/ItemContext.tsx
+++ b/src/components/ItemContext.tsx
@@ -11,7 +11,7 @@ import {
Consumer as AccordionContextConsumer,
} from './AccordionContext';
-export type UUID = string;
+export type UUID = string | number;
type ProviderProps = {
children?: React.ReactNode;