Refactor busters (#28)

* Remove anticache

This functionality isn't needed as we can handle cache control headers on the
server side.

* Replace __=0 with format=json

The original intent of __=0 was to bust the browser cache that happens
when visiting a page in HTML format where subsequent visits to the same
page with a different content negotiation would return the wrong format.

I did not know of Rail's own `format=json` that you can add the param to help
prevent that issue from ever happening. This replaces that.

superglue/lib/utils/url.js

@@ -1,7 +1,5 @@
 import parse from 'url-parse'
 
-const uniqueId = () => Math.random().toString(36).substring(2, 10)
-
 export function pathQuery(url) {
   const { pathname, query } = new parse(url, {})
 
@@ -21,43 +19,19 @@ export function hasPropsAt(url) {
   return !!query['props_at']
 }
 
-export function withAntiCache(url) {
-  url = new parse(url, {}, true)
-
-  if (Object.prototype.hasOwnProperty.call(url.query, '_')) {
-    return url.toString()
-  } else {
-    url.query['_'] = uniqueId()
-    return url.toString()
-  }
-}
-
-export function withMimeBust(url) {
+export function withFormatJson(url) {
   url = new parse(url, {}, true)
-  if (Object.prototype.hasOwnProperty.call(url.query, '__')) {
-    return url.toString()
-  } else {
-    url.query['__'] = '0'
-    return url.toString()
-  }
-}
+  url.query['format'] = 'json'
 
-export function withoutBusters(url) {
-  url = new parse(url, {}, true)
-  let query = url.query
-  delete query['__']
-  delete query['_']
-  url.query = query
-  return pathQuery(url.toString())
+  return url.toString()
 }
 
 export function pathWithoutBZParams(url) {
   url = new parse(url, {}, true)
   let query = url.query
 
-  delete query['__']
-  delete query['_']
   delete query['props_at']
+  delete query['format']
   url.query = query
 
   return pathQueryHash(url.toString())
@@ -77,9 +51,8 @@ export function urlToPageKey(url) {
   url = new parse(url, {}, true)
   let query = url.query
 
-  delete query['__']
-  delete query['_']
   delete query['props_at']
+  delete query['format']
   url.query = query
 
   return pathQuery(url.toString())
@@ -91,12 +64,17 @@ export function withoutHash(url) {
   return url.toString()
 }
 
-export function formatForXHR(url, opts = {}) {
-  let formats = [withMimeBust, withoutHash]
+export function withoutBusters(url) {
+  url = new parse(url, {}, true)
+  let query = url.query
+  delete query['format']
+  url.query = query
+
+  return pathQuery(url.toString())
+}
 
-  if (opts.cacheRequest) {
-    formats.push(withAntiCache)
-  }
+export function formatForXHR(url) {
+  let formats = [withoutHash, withFormatJson]
 
   return formats.reduce((memo, f) => f(memo), url)
 }

superglue/spec/features/navigation.spec.js

@@ -158,7 +158,7 @@ describe('navigation', () => {
 
       const mockResponse = rsp.visitSuccess()
       mockResponse.headers['x-response-url'] = '/foo'
-      fetchMock.mock('http://example.com/foo?__=0', mockResponse)
+      fetchMock.mock('http://example.com/foo?format=json', mockResponse)
 
       const pageState = {
         data: { heading: 'Some heading 2' },
@@ -221,7 +221,7 @@ describe('navigation', () => {
 
       const mockResponse = rsp.visitSuccess()
       mockResponse.headers['x-response-url'] = '/foo'
-      fetchMock.mock('http://example.com/foo?__=0', mockResponse)
+      fetchMock.mock('http://example.com/foo?format=json', mockResponse)
 
       const pageState = {
         data: { heading: 'Some heading 2' },
@@ -337,7 +337,7 @@ describe('navigation', () => {
 
       const mockResponse = rsp.visitSuccess()
       mockResponse.headers['x-response-url'] = '/foo'
-      fetchMock.mock('http://example.com/foo?__=0', mockResponse)
+      fetchMock.mock('http://example.com/foo?format=json', mockResponse)
 
       component.find('button').simulate('click')
       await flushPromises()
@@ -435,7 +435,7 @@ describe('navigation', () => {
 
       const mockResponse = rsp.visitSuccess()
       mockResponse.headers['x-response-url'] = '/foo'
-      fetchMock.mock('http://example.com/foo?__=0', mockResponse)
+      fetchMock.mock('http://example.com/foo?format=json', mockResponse)
 
       component.find('button').simulate('click')
 
@@ -523,7 +523,7 @@ describe('navigation', () => {
       history.push('/bar') // Gets replaced on Superglue.start
       const mockResponse = rsp.visitSuccess()
       mockResponse.headers['x-response-url'] = '/foo'
-      fetchMock.mock('http://example.com/foo?__=0', mockResponse)
+      fetchMock.mock('http://example.com/foo?format=json', mockResponse)
 
       const initialPage = {
         data: {
@@ -602,7 +602,7 @@ describe('navigation', () => {
 
       const mockResponse = rsp.graftSuccessWithNewZip()
       mockResponse.headers['x-response-url'] = '/foo'
-      fetchMock.mock('http://example.com/foo?props_at=address&__=0', mockResponse)
+      fetchMock.mock('http://example.com/foo?props_at=address&format=json', mockResponse)
 
       component.find('button').simulate('click')
       await flushPromises()