refactor: move helper, add tests

src/__tests__/ensure-ref-passed.test.ts

@@ -0,0 +1,27 @@
+/**
+ * @jest-environment jsdom
+ */
+
+import ensureRefPassed from '../helpers/ensure-ref-passed'
+import { NoRefError } from '../no-ref-error'
+import { InternalItem, ItemRef } from '../types'
+
+describe('ensureRefPassed helper', () => {
+  test('entry with element-ref should return entry', () => {
+    const entry: [ItemRef, InternalItem] = [
+      { current: new Image() },
+      {} as InternalItem,
+    ]
+
+    expect(ensureRefPassed(entry)).toBe(entry)
+  })
+
+  test('entry with null-ref should throw', () => {
+    const entry: [ItemRef, InternalItem] = [
+      { current: null },
+      {} as InternalItem,
+    ]
+
+    expect(() => ensureRefPassed(entry)).toThrow(NoRefError)
+  })
+})

src/__tests__/entry-item-ref-is-element.test.ts

@@ -0,0 +1,26 @@
+/**
+ * @jest-environment jsdom
+ */
+
+import entryItemRefIsElement from '../helpers/entry-item-ref-is-element'
+import { InternalItem, ItemRef } from '../types'
+
+describe('entryItemRefIsElement helper', () => {
+  test('ref with element should return true', () => {
+    const entry: [ItemRef, InternalItem] = [
+      { current: new Image() },
+      {} as InternalItem,
+    ]
+
+    expect(entryItemRefIsElement(entry)).toBe(true)
+  })
+
+  test('ref with null should return false', () => {
+    const entry: [ItemRef, InternalItem] = [
+      { current: null },
+      {} as InternalItem,
+    ]
+
+    expect(entryItemRefIsElement(entry)).toBe(false)
+  })
+})

src/gallery.tsx

@@ -19,9 +19,8 @@ import getHashValue from './helpers/get-hash-value'
 import getBaseUrl from './helpers/get-base-url'
 import hashIncludesNavigationQueryParams from './helpers/hash-includes-navigation-query-params'
 import getInitialActiveSlideIndex from './helpers/get-initial-active-slide-index'
-import ensureRefPassed, {
-  entryItemRefIsElement,
-} from './helpers/ensure-ref-passed'
+import ensureRefPassed from './helpers/ensure-ref-passed'
+import entryItemRefIsElement from './helpers/entry-item-ref-is-element'
 import { Context } from './context'
 import { GalleryProps, ItemRef, InternalItem, InternalAPI } from './types'
 import PhotoSwipeLightboxStub from './lightbox-stub'

src/helpers/ensure-ref-passed.ts

@@ -1,10 +1,6 @@
 import { NoRefError } from '../no-ref-error'
 import { EnsuredItemRef, InternalItem, ItemRef } from '../types'
-
-export const entryItemRefIsElement = (
-  entry: [ItemRef, InternalItem],
-): entry is [EnsuredItemRef, InternalItem] =>
-  entry[0].current instanceof Element
+import entryItemRefIsElement from './entry-item-ref-is-element'
 
 const ensureRefPassed = (
   entry: [ItemRef, InternalItem],

src/helpers/entry-item-ref-is-element.ts

@@ -0,0 +1,8 @@
+import { EnsuredItemRef, InternalItem, ItemRef } from '../types'
+
+const entryItemRefIsElement = (
+  entry: [ItemRef, InternalItem],
+): entry is [EnsuredItemRef, InternalItem] =>
+  entry[0].current instanceof Element
+
+export default entryItemRefIsElement

src/item.ts

@@ -16,12 +16,6 @@ export const Item = <NodeType extends HTMLElement>({
   const ref = useRef<NodeType | null>(null)
   const { remove, set, handleClick, isRefRegistered } = useApiContext()
 
-  useEffect(() => {
-    return () => {
-      remove(ref)
-    }
-  }, [remove])
-
   const refCallback = useCallback<ChildrenFnProps<NodeType>['ref']>(
     (node) => {
       ref.current = node
@@ -48,6 +42,12 @@ export const Item = <NodeType extends HTMLElement>({
     [refCallback, open],
   )
 
+  useEffect(() => {
+    return () => {
+      remove(ref)
+    }
+  }, [remove])
+
   return children(childrenFnProps)
 }