API Fetch: Make preloaded OPTIONS requests use parse setting (#28862)

* Fix: make preloaded OPTIONS requests use `parse` setting

* add: Changelog entry and fix typo in test

packages/api-fetch/CHANGELOG.md

@@ -2,6 +2,10 @@
 
 ## Unreleased
 
+### Breaking changes
+
+- `OPTIONS` requests which are handled by the preloading middleware are no longer resolved as unparsed responses unless you explicitly set `parse: false`, for consistency with other request methods. If you expect an unparsed response, add `{ parse: false }` to your request options to preserve the previous behavior.
+
 ## 3.23.1 (2021-04-15)
 
 ### Bug Fixes

packages/api-fetch/src/middlewares/preloading.js

@@ -72,7 +72,11 @@ function createPreloadingMiddleware( preloadedData ) {
 				cache[ method ] &&
 				cache[ method ][ path ]
 			) {
-				return Promise.resolve( cache[ method ][ path ] );
+				return Promise.resolve(
+					parse
+						? cache[ method ][ path ].body
+						: cache[ method ][ path ]
+				);
 			}
 		}
 

packages/api-fetch/src/middlewares/test/preloading.js

@@ -79,6 +79,72 @@ describe( 'Preloading Middleware', () => {
 					expect( nextSpy ).toHaveBeenCalled();
 				} );
 			} );
+
+			describe( 'and the OPTIONS request has a parse flag', () => {
+				it( 'should return the full response if parse: false', () => {
+					const data = {
+						body: {
+							status: 'this is the preloaded response',
+						},
+						headers: {
+							Allow: 'GET, POST',
+						},
+					};
+
+					const preloadedData = {
+						OPTIONS: {
+							'wp/v2/posts': data,
+						},
+					};
+
+					const preloadingMiddleware = createPreloadingMiddleware(
+						preloadedData
+					);
+
+					const requestOptions = {
+						method: 'OPTIONS',
+						path: 'wp/v2/posts',
+						parse: false,
+					};
+
+					const response = preloadingMiddleware( requestOptions );
+					return response.then( ( value ) => {
+						expect( value ).toEqual( data );
+					} );
+				} );
+
+				it( 'should return only the response body if parse: true', () => {
+					const body = {
+						status: 'this is the preloaded response',
+					};
+
+					const preloadedData = {
+						OPTIONS: {
+							'wp/v2/posts': {
+								body,
+								headers: {
+									Allow: 'GET, POST',
+								},
+							},
+						},
+					};
+
+					const preloadingMiddleware = createPreloadingMiddleware(
+						preloadedData
+					);
+
+					const requestOptions = {
+						method: 'OPTIONS',
+						path: 'wp/v2/posts',
+						parse: true,
+					};
+
+					const response = preloadingMiddleware( requestOptions );
+					return response.then( ( value ) => {
+						expect( value ).toEqual( body );
+					} );
+				} );
+			} );
 		} );
 
 		describe( 'when the requested data is not from a preloaded endpoint', () => {
@@ -139,7 +205,7 @@ describe( 'Preloading Middleware', () => {
 			[ 'method empty', { [ method ]: {} } ],
 		] )( '%s', ( label, preloadedData ) => {
 			it( 'should move to the next middleware if no preloaded data', () => {
-				const prelooadingMiddleware = createPreloadingMiddleware(
+				const preloadingMiddleware = createPreloadingMiddleware(
 					preloadedData
 				);
 				const requestOptions = {
@@ -152,7 +218,7 @@ describe( 'Preloading Middleware', () => {
 					return true;
 				};
 
-				const ret = prelooadingMiddleware( requestOptions, callback );
+				const ret = preloadingMiddleware( requestOptions, callback );
 				expect( ret ).toBe( true );
 			} );
 		} );