Merge pull request #972 from j-beatzz/remove-hash-from-client-request-url

Make ClientRequest chop off fragment identifiers from urls

Author: roblg

packages/react-server/core/ClientRequest.js

@@ -10,11 +10,19 @@ class ClientRequest {
 		bundleData,
 		reuseDom,
 	}={}) {
-		this._url = url;
 		this._opts = {
 			bundleData,
 			reuseDom,
 		}
+
+		// Chop off the fragment identifier from the url i.e everything from the # to the end of the url
+		// if it exists to make this consistent with ExpressServerRequest.
+		var match = url.match(/([^#]*)/);
+		if (match === null || !match[1]) {
+			this._url = url
+		} else {
+			this._url = match[1];
+		}
 	}
 
 	setRoute(route) {
@@ -38,8 +46,8 @@ class ClientRequest {
 	}
 
 	getQuery() {
-		//Grab fragment between first "?" and first "#" or end of string
-		var match = this._url.match(/\?([^#]*)/);
+		// Grab fragment after first "?"
+		var match = this._url.match(/\?(.*)/);
 
 		if (match === null || !match[1]) {
 			return {};

packages/react-server/core/__tests__/ClientRequestSpec.js

@@ -7,6 +7,26 @@ describe("ClientRequest", () => {
 		clientRequest = new ClientRequest("/");
 	});
 
+	it("removes fragment identifiers from the url", (done) => {
+		clientRequest = new ClientRequest("/");
+		expect(clientRequest.getUrl()).toEqual("/");
+		clientRequest = new ClientRequest("/react-server/foo#bar");
+		expect(clientRequest.getUrl()).toEqual("/react-server/foo");
+		clientRequest = new ClientRequest("/react-server/foo/#bar#bazz");
+		expect(clientRequest.getUrl()).toEqual("/react-server/foo/");
+		clientRequest = new ClientRequest("/react-server/foo/?#bar");
+		expect(clientRequest.getUrl()).toEqual("/react-server/foo/?");
+		clientRequest = new ClientRequest("/react-server/foo/?foo=bar&baz=123");
+		expect(clientRequest.getUrl()).toEqual("/react-server/foo/?foo=bar&baz=123");
+		clientRequest = new ClientRequest("/react-server/foo/?foo=bar&baz=123#");
+		expect(clientRequest.getUrl()).toEqual("/react-server/foo/?foo=bar&baz=123");
+		clientRequest = new ClientRequest("/react-server/foo/?foo=bar&baz=123&zed=abc?#some-fragment?#");
+		expect(clientRequest.getUrl()).toEqual("/react-server/foo/?foo=bar&baz=123&zed=abc?");
+		clientRequest = new ClientRequest("/react-server/foo#?bar=3&foo=7");
+		expect(clientRequest.getUrl()).toEqual("/react-server/foo");
+		done();
+	});
+
 	it("parses query params correctly", (done) => {
 		clientRequest = new ClientRequest("/");
 		expect(clientRequest.getQuery()).toEqual({});
@@ -24,6 +44,8 @@ describe("ClientRequest", () => {
 		expect(clientRequest.getQuery()).toEqual({foo: "bar", baz: "123"});
 		clientRequest = new ClientRequest("/react-server/foo/?foo=bar&baz=123&zed=abc?#some-fragment?#");
 		expect(clientRequest.getQuery()).toEqual({foo: "bar", baz: "123", zed: "abc?"});
+		clientRequest = new ClientRequest("/react-server/foo#?bar=3&foo=7");
+		expect(clientRequest.getQuery()).toEqual({});
 		done();
 	});