Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Parse params in ajax.get as query string #2070

Merged
merged 1 commit into from Apr 17, 2021
Merged

Parse params in ajax.get as query string #2070

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
32 changes: 20 additions & 12 deletions package/src/utils/__tests__/ajax.spec.js
View file
Open in desktop
Expand Up @@ -10,15 +10,15 @@ beforeEach(() => {

describe("ajax('get')", () => {
it("sends X-CSRF-TOKEN header", async () => {
xhrMock.get("/users", (req, res) => {
xhrMock.get("http://localhost/users", (req, res) => {
expect(req.header("X-CSRF-TOKEN")).toEqual(token)
return res.status(200).body('{"message":"Ok"}')
})
await ajax("get", "/users")
})

it("sends Content-Type header", async () => {
xhrMock.get("/users", (req, res) => {
xhrMock.get("http://localhost/users", (req, res) => {
expect(req.header("Content-Type")).toEqual(
"application/json; charset=utf-8"
)
Expand All @@ -28,15 +28,15 @@ describe("ajax('get')", () => {
})

it("sends Accept header", async () => {
xhrMock.get("/users", (req, res) => {
xhrMock.get("http://localhost/users", (req, res) => {
expect(req.header("Accept")).toEqual("application/json")
return res.status(200).body('{"message":"Ok"}')
})
await ajax("get", "/users")
})

it("returns JSON", async () => {
xhrMock.get("/users", (_req, res) => {
xhrMock.get("http://localhost/users", (_req, res) => {
return res.status(200).body('{"email":"mail@example.com"}')
})
await ajax("get", "/users").then((res) => {
Expand All @@ -45,7 +45,7 @@ describe("ajax('get')", () => {
})

it("JSON parse errors get rejected", async () => {
xhrMock.get("/users", (_req, res) => {
xhrMock.get("http://localhost/users", (_req, res) => {
return res.status(200).body('email => "mail@example.com"')
})
expect.assertions(1)
Expand All @@ -55,7 +55,7 @@ describe("ajax('get')", () => {
})

it("network errors get rejected", async () => {
xhrMock.get("/users", () => {
xhrMock.get("http://localhost/users", () => {
return Promise.reject(new Error())
})
expect.assertions(1)
Expand All @@ -65,7 +65,7 @@ describe("ajax('get')", () => {
})

it("server errors get rejected", async () => {
xhrMock.get("/users", (_req, res) => {
xhrMock.get("http://localhost/users", (_req, res) => {
return res.status(401).body('{"error":"Unauthorized"}')
})
expect.assertions(1)
Expand All @@ -75,27 +75,35 @@ describe("ajax('get')", () => {
})

it("server errors parsing errors get rejected", async () => {
xhrMock.get("/users", (_req, res) => {
xhrMock.get("http://localhost/users", (_req, res) => {
return res.status(401).body("Unauthorized")
})
expect.assertions(1)
await ajax("get", "/users").catch((e) => {
expect(e.message).toMatch("Unexpected token")
})
})

it("params get attached as query string", async () => {
xhrMock.get("http://localhost/users?name=foo", (_req, res) => {
return res.status(200).body(`{"name":"foo"}`)
})
const { data } = await ajax("get", "/users", { name: "foo" })
expect(data.name).toEqual("foo")
})
})

describe("ajax('post')", () => {
it("sends X-CSRF-TOKEN header", async () => {
xhrMock.post("/users", (req, res) => {
xhrMock.post("http://localhost/users", (req, res) => {
expect(req.header("X-CSRF-TOKEN")).toEqual(token)
return res.status(200).body('{"message":"Ok"}')
})
await ajax("post", "/users")
})

it("sends Content-Type header", async () => {
xhrMock.post("/users", (req, res) => {
xhrMock.post("http://localhost/users", (req, res) => {
expect(req.header("Content-Type")).toEqual(
"application/json; charset=utf-8"
)
Expand All @@ -105,15 +113,15 @@ describe("ajax('post')", () => {
})

it("sends Accept header", async () => {
xhrMock.post("/users", (req, res) => {
xhrMock.post("http://localhost/users", (req, res) => {
expect(req.header("Accept")).toEqual("application/json")
return res.status(200).body('{"message":"Ok"}')
})
await ajax("post", "/users")
})

it("sends JSON data", async () => {
xhrMock.post("/users", (req, res) => {
xhrMock.post("http://localhost/users", (req, res) => {
expect(req.body()).toEqual('{"email":"mail@example.com"}')
return res.status(200).body('{"message":"Ok"}')
})
Expand Down
11 changes: 8 additions & 3 deletions package/src/utils/ajax.js
View file
Open in desktop
Expand Up @@ -29,16 +29,21 @@ function getToken() {
return metaTag.attributes.content.textContent
}

export default function ajax(method, url, data) {
export default function ajax(method, path, data) {
const xhr = new XMLHttpRequest()
const promise = buildPromise(xhr)
const url = new URL(window.location.origin + path)

xhr.open(method, url)
if (data && method.toLowerCase() === "get") {
url.search = new URLSearchParams(data).toString()
}

xhr.open(method, url.toString())
xhr.setRequestHeader("Content-type", "application/json; charset=utf-8")
xhr.setRequestHeader("Accept", "application/json")
xhr.setRequestHeader("X-CSRF-Token", getToken())

if (data) {
if (data && method.toLowerCase() !== "get") {
xhr.send(JSON.stringify(data))
} else {
xhr.send()
Expand Down