Handle falsy as props in Link.

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-storefront",
-  "version": "8.11.0",
+  "version": "8.11.1",
   "description": "Build and deploy e-commerce progressive web apps (PWAs) in record time.",
   "module": "./index.js",
   "license": "Apache-2.0",

src/api/addVersion.js

@@ -12,6 +12,8 @@ export const VERSION_PARAM = '__v__'
  * @return {URL}
  */
 export default function addVersion(url) {
+  if (!url) return url
+
   let appOrigin = 'http://throwaway.api'
 
   /* istanbul ignore else */

src/link/Link.js

@@ -35,22 +35,24 @@ const Link = ({ as, href, prefetch, prefetchURL, pageData, onClick, children, ..
     }
   })
 
+  prefetchURL = prefetchURL || (as && getAPIURL(as))
+
   useIntersectionObserver(
-    () => (as && prefetch === 'visible' ? ref : null),
+    () => (prefetchURL && prefetch === 'visible' ? ref : null),
     (visible, disconnect) => {
-      if (visible) {
+      if (visible && prefetchURL) {
         disconnect()
-        doPrefetch(prefetchURL || getAPIURL(as))
+        doPrefetch(prefetchURL)
       }
     },
-    [as, prefetch],
+    [prefetchURL, prefetch],
   )
 
   useEffect(() => {
-    if (prefetch === 'always') {
-      doPrefetch(getAPIURL(as))
+    if (prefetch === 'always' && prefetchURL) {
+      doPrefetch(prefetchURL)
     }
-  }, [as])
+  }, [prefetchURL])
 
   if (!children || typeof children === 'string') {
     return (

src/serviceWorker.js

@@ -30,6 +30,8 @@ export function waitForServiceWorker() {
  * @param {String} url The URL to prefetch
  */
 export async function prefetch(url) {
+  if (url == null) return
+
   if (process.env.NODE_ENV !== 'production' && process.env.SERVICE_WORKER !== 'true') {
     // note that even though we wait for the service worker to be available, during local
     // development it is still possible for a service worker to be around from a previous

test/api/addVersion.test.js

@@ -21,6 +21,10 @@ describe('addVersion', () => {
     )
   })
 
+  it('should return the original url if it is falsy', () => {
+    expect(addVersion()).toBeUndefined()
+  })
+
   it('should not duplicate the version query param', () => {
     expect(addVersion('/foo?__v__=1').toString()).toBe('http://localhost/foo?__v__=1')
   })

test/link/Link.test.js

@@ -58,6 +58,22 @@ describe('Link', () => {
     expect(onClick).toHaveBeenCalled()
   })
 
+  it('should support children', () => {
+    const onClick = jest.fn()
+
+    const Test = () => {
+      return (
+        <Link as="/p/1" href="/p/[productId]" onClick={onClick}>
+          <a>Product 1</a>
+        </Link>
+      )
+    }
+
+    wrapper = mount(<Test />)
+    wrapper.find(Link).simulate('click')
+    expect(onClick).toHaveBeenCalled()
+  })
+
   describe('prefetch', () => {
     it('should support prefetch=visible', () => {
       const Test = () => {
@@ -104,7 +120,7 @@ describe('Link', () => {
       expect(prefetch).toHaveBeenCalledWith('/api/p/1')
     })
 
-    it('should prefetch=false', () => {
+    it('should support prefetch=false', () => {
       const Test = () => {
         return (
           <Link as="/p/1" href="/p/[productId]">
@@ -116,5 +132,18 @@ describe('Link', () => {
       wrapper = mount(<Test />)
       expect(prefetch).not.toHaveBeenCalled()
     })
+
+    it('should not prefetch if the as prop is not provided', () => {
+      const Test = () => {
+        return (
+          <Link as={undefined} href="/p/[productId]" prefetch="always">
+            Product 1
+          </Link>
+        )
+      }
+
+      wrapper = mount(<Test />)
+      expect(prefetch).not.toHaveBeenCalled()
+    })
   })
 })

test/serviceWorker.test.js

@@ -70,6 +70,18 @@ describe('all', () => {
     })
 
     describe('prefetch', () => {
+      it('should do nothing if the url is null', async () => {
+        let error
+
+        try {
+          await prefetch()
+        } catch (e) {
+          error = e
+        }
+
+        expect(error).toBeUndefined()
+      })
+
       it('should append a single link tag per url', async () => {
         await prefetch('/foo')
         await prefetch('/foo')