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

Update Request and Response to return Promise #55

Merged
merged 2 commits into from
Jun 18, 2024
Merged

Update Request and Response to return Promise #55

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
c33e4bc
Expect Request and Response to return Promise
allansson Jun 18, 2024
1961449
Return Promise from Request and Response
allansson Jun 18, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
30 changes: 15 additions & 15 deletions types/k6/experimental/browser.d.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3683,7 +3683,7 @@ export interface Request {
* lower-case.
* @returns The headers object.
*/
allHeaders(): Record<string, string>;
allHeaders(): Promise<Record<string, string>>;

/**
* @returns the Frame that initiated this request
Expand All @@ -3703,14 +3703,14 @@ export interface Request {
* `Set-Cookie`, appear in the array multiple times.
* @returns An array of all the request HTTP headers.
*/
headersArray(): Array<{ name: string; value: string }>;
headersArray(): Promise<Array<{ name: string; value: string }>>;

/**
* Retuns the value of the header matching the name. The name is case insensitive.
* @param name Header name to retrieve value for.
* @returns The value of the header matching the name.
*/
headerValue(name: string): string | null;
headerValue(name: string): Promise<string | null>;

/**
* @returns a boolean stating whether the request is for a navigation
Expand All @@ -3727,7 +3727,7 @@ export interface Request {
* Contains the request's post body, if any.
* @returns request's post body
*/
postData(): string;
postData(): string | null;

/**
* Request's post body in a binary form, if any.
Expand All @@ -3749,13 +3749,13 @@ export interface Request {
* due to error.
* @returns The `Response` object, or `null` if the response was not received due to error.
*/
response(): Response | null;
response(): Promise<Response | null>;

/**
* Returns resource size information for given request.
* @returns Resource size information for given request.
*/
size(): { body: number; headers: number };
size(): Promise<{ body: number; headers: number }>;

/**
* Returns resource timing information for given request. Most of the timing values
Expand All @@ -3781,13 +3781,13 @@ export interface Response {
* lower-case.
* @returns The headers object.
*/
allHeaders(): Record<string, string>;
allHeaders(): Promise<Record<string, string>>;

/**
* Returns the response body.
* @returns A buffer with response body.
*/
body(): ArrayBuffer;
body(): Promise<ArrayBuffer>;

/**
* @returns the Frame that initiated this response
Expand All @@ -3807,7 +3807,7 @@ export interface Response {
* appear in the array multiple times.
* @returns An array of all the request HTTP headers.
*/
headersArray(): Array<{ name: string; value: string }>;
headersArray(): Promise<Array<{ name: string; value: string }>>;

/**
* Returns the value of the header matching the name. The name is case insensitive.
Expand All @@ -3817,22 +3817,22 @@ export interface Response {
* @param name Header name to retrieve value for.
* @returns The header value for the given name.
*/
headerValue(name: string): string | null;
headerValue(name: string): Promise<string | null>;

/**
* Returns all values of the headers matching the name, for example `set-cookie`.
* The name is case insensitive.
* @param name Header name to retrieve values for.
* @returns An array of header values for the given name.
*/
headerValues(name: string): string[];
headerValues(name: string): Promise<string[]>;

/**
* Returns the JSON representation of response body. Throws if response body is not
* parsable via `JSON.parse`.
* @returns JSON representation of response body.
*/
json(): any;
json(): Promise<any>;

/**
* Contains a boolean stating whether the response was successful (status in the
Expand All @@ -3851,13 +3851,13 @@ export interface Response {
* Security details associated with this response.
* @returns A matching `SecurityDetailsObject`
*/
securityDetails(): SecurityDetailsObject | null;
securityDetails(): Promise<SecurityDetailsObject | null>;

/**
* Returns the IP address and port of the server for this response.
* @returns The IP address and port of the server
*/
serverAddr(): { ipAddress: string; port: number } | null;
serverAddr(): Promise<{ ipAddress: string; port: number } | null>;

/**
* Contains the status code of the response (e.g., 200 for a success).
Expand All @@ -3875,7 +3875,7 @@ export interface Response {
* The size of the response body and the headers.
* @returns The size of the response body and the headers.
*/
size(): { body: number; headers: number };
size(): Promise<{ body: number; headers: number }>;

/**
* Contains the URL of the response.
Expand Down
124 changes: 62 additions & 62 deletions types/k6/test/browser.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1203,105 +1203,105 @@ async function test() {
//
// Request
//
const request = page.goto(url).then(r => r?.request());
Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Added ! to the returned request to make sure we're testing the right thing. Without it, we need to use ?. everywhere, changing the return type. This is a problem in case we want to do a change where a function actually returns undefined. Then we get a positive on the test for the wrong reason.

const request = await page.goto(url).then(r => r?.request()!);

// $ExpectType Promise<Record<string, string> | undefined>
request.then(r => r?.allHeaders());
Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This pattern is what had me believe that the APIs were already async. I updated it to improve readability and to avoid errors where returning a Promise inside another Promise would flatten into a Promise.

// $ExpectType Promise<Record<string, string>>
request.allHeaders();

// $ExpectType Promise<Frame | undefined>
request.then(r => r?.frame());
// $ExpectType Frame
request.frame();

// $ExpectType Promise<Record<string, string> | undefined>
request.then(r => r?.headers());
// $ExpectType Record<string, string>
request.headers();

// $ExpectType Promise<{ name: string; value: string; }[] | undefined>
request.then(r => r?.headersArray());
// $ExpectType Promise<{ name: string; value: string; }[]>
request.headersArray();

// @ts-expect-error
request.then(r => r?.headerValue());
// $ExpectType Promise<string | null | undefined>
request.then(r => r?.headerValue("content-type"));
request.headerValue();
// $ExpectType Promise<string | null>
request.headerValue("content-type");

// $ExpectType Promise<boolean | undefined>
request.then(r => r?.isNavigationRequest());
// $ExpectType boolean
request.isNavigationRequest();

// $ExpectType Promise<string | undefined>
request.then(r => r?.method());
// $ExpectType string
request.method();

// $ExpectType Promise<string | undefined>
request.then(r => r?.postData());
// $ExpectType string | null
request.postData();

// $ExpectType Promise<ArrayBuffer | null | undefined>
request.then(r => r?.postDataBuffer());
// $ExpectType ArrayBuffer | null
request.postDataBuffer();

// $ExpectType Promise<"document" | "stylesheet" | "image" | "media" | "font" | "script" | "texttrack" | "xhr" | "fetch" | "eventsource" | "websocket" | "manifest" | "other" | undefined>
request.then(r => r?.resourceType());
// $ExpectType ResourceType
request.resourceType();

// $ExpectType Promise<Response | null | undefined>
request.then(r => r?.response());
// $ExpectType Promise<Response | null>
request.response();

// $ExpectType Promise<{ body: number; headers: number; } | undefined>
request.then(r => r?.size());
// $ExpectType Promise<{ body: number; headers: number; }>
request.size();

// $ExpectType Promise<ResourceTiming | undefined>
request.then(r => r?.timing());
// $ExpectType ResourceTiming
request.timing();

//
// Response
//
const response = page.goto(url);
const response = await page.goto(url).then(r => r!);

// $ExpectType Promise<Record<string, string> | undefined>
response.then(r => r?.allHeaders());
// $ExpectType Promise<Record<string, string>>
response.allHeaders();

// $ExpectType Promise<ArrayBuffer | undefined>
response.then(r => r?.body());
// $ExpectType Promise<ArrayBuffer>
response.body();

// $ExpectType Promise<Frame | undefined>
response.then(r => r?.frame());
// $ExpectType Frame
response.frame();

// $ExpectType Promise<Record<string, string> | undefined>
response.then(r => r?.headers());
// $ExpectType Record<string, string>
response.headers();

// $ExpectType Promise<{ name: string; value: string; }[] | undefined>
response.then(r => r?.headersArray());
// $ExpectType Promise<{ name: string; value: string; }[]>
response.headersArray();

// @ts-expect-error
response.then(r => r?.headerValue());
// $ExpectType Promise<string | null | undefined>
response.then(r => r?.headerValue("content-type"));
response.headerValue();
// $ExpectType Promise<string | null>
response.headerValue("content-type");

// @ts-expect-error
response.then(r => r?.headerValues());
// $ExpectType Promise<string[] | undefined>
response.then(r => r?.headerValues("content-type"));
response.headerValues();
// $ExpectType Promise<string[]>
response.headerValues("content-type");

// $ExpectType Promise<any>
response.then(r => r?.json());
response.json();

// $ExpectType Promise<boolean | undefined>
response.then(r => r?.ok());
// $ExpectType boolean
response.ok();

// $ExpectType Promise<Request | undefined>
response.then(r => r?.request());
// $ExpectType Request
response.request();

// $ExpectType Promise<SecurityDetailsObject | null | undefined>
response.then(r => r?.securityDetails());
// $ExpectType Promise<SecurityDetailsObject | null>
response.securityDetails();

// $ExpectType Promise<{ ipAddress: string; port: number; } | null | undefined>
response.then(r => r?.serverAddr());
// $ExpectType Promise<{ ipAddress: string; port: number; } | null>
response.serverAddr();

// $ExpectType Promise<number | undefined>
response.then(r => r?.status());
// $ExpectType number
response.status();

// $ExpectType Promise<string | undefined>
response.then(r => r?.statusText());
// $ExpectType string
response.statusText();

// $ExpectType Promise<{ body: number; headers: number; } | undefined>
response.then(r => r?.size());
// $ExpectType Promise<{ body: number; headers: number; }>
response.size();
Comment on lines +1300 to +1301
Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This function did not have a counter-part in Playwright, but I assumed that it's signature would be the same as the one in Request.


// $ExpectType Promise<string | undefined>
response.then(r => r?.url());
// $ExpectType string
response.url();

//
// ElementHandle
Expand Down