Window Open Promise by Lou

🪟 Promised Window.open();.

Usage

📦 Node

Install window-open-promise as a dependency:

pnpm add window-open-promise
# or
npm install window-open-promise
# or
yarn add window-open-promise

Import it and use it:

import { windowOpenPromise } from "window-open-promise";

const windowOpen = windowOpenPromise(globalThis);

windowOpen({
	url: "https://example.com", // URL is not required, you can open a blank window
	top: 10,
	left: 10,
})
	.then(newWindow => {
		newWindow.console.log("This will log in the new window.");
		newWindow.addEventListener("beforeunload", _event => {
			console.log("This will log when the new window is closed.");
		});
	})
	.catch(_error => {
		console.error("This will log if the new window can't be opened.");
	});

🦕 Deno

Import window-open-promise using the npm: prefix, and use it directly:

import { windowOpenPromise } from "npm:window-open-promise";

const windowOpen = windowOpenPromise(globalThis);

try {
	const newWindow = await windowOpen({
		url: "https://example.com", // URL is not required, you can open a blank window
		top: 10,
		left: 10,
	});
	newWindow.console.log("This will log in the new window.");
	newWindow.addEventListener("beforeunload", _event => {
		console.log("This will log when the new window is closed.");
	});
} catch (_error) {
	console.error("This will log if the new window can't be opened.");
}

🌎 Browser

Import window-open-promise using esm.sh, and use it directly:

<script type="module">
	import { windowOpenPromise } from "https://esm.sh/window-open-promise";

	const windowOpen = windowOpenPromise(globalThis);

	try {
		const newWindow = await windowOpen({
			url: "https://example.com", // URL is not required, you can open a blank window
			top: 10,
			left: 10,
		});
		newWindow.console.log("This will log in the new window.");
		newWindow.addEventListener("beforeunload", _event => {
			console.log("This will log when the new window is closed.");
		});
	} catch (_error) {
		console.error("This will log if the new window can't be opened.");
	}
</script>

Useful links

• 📝 Documentation: TypeDoc generated documentation.
• ⏳ Changelog: List of changes between versions.
• ✅ Tests Coverage: Coveralls page with tests coverage.

Type Aliases

WindowOpenPromiseFeatures

Ƭ WindowOpenPromiseFeatures: Omit<WindowOpenPromiseOptions, "replace" | "target" | "url">

WindowOpenPromise features.

View source

---

WindowOpenPromiseOptions

Ƭ WindowOpenPromiseOptions: Object

WindowOpenPromise options.

Type declaration

Name	Type	Description
height (optional)	number	WindowOpenPromise height (minimum 100).
left (optional)	number	WindowOpenPromise left position.
menuBar (optional)	boolean	WindowOpenPromise renders the menu bar.
noOpener (optional)	boolean	WindowOpenPromise can’t access it’s opener.
resizable (optional)	boolean	WindowOpenPromise is resizable.
scrollbars (optional)	boolean	WindowOpenPromise has scrollbars.
target (optional)	string	WindowOpenPromise target.
titleBar (optional)	boolean	WindowOpenPromise renders the title bar.
toolBar (optional)	boolean	WindowOpenPromise renders the tool bar.
top (optional)	number	WindowOpenPromise top position.
url (optional)	string	WindowOpenPromise url.
width (optional)	number	WindowOpenPromise width (minimum 100).

View source

Functions

featureJoin

▸ featureJoin<Iterable_1>(iterable): ReducerOutput<Iterable_1, string>

Joins given array of features with the FEATURE_SEPARATOR.

Type parameters

Name	Type
Iterable_1	extends IsomorphicIterable

Parameters

Name	Type
iterable	Iterable_1

Returns

ReducerOutput<Iterable_1, string>

Joint string.

Example

featureJoin(["top=10", "left=10", "resizable=1"]); // "top=10,left=10,resizable=1"

View source

---

featureMap

▸ featureMap<Iterable_1>(iterable): Iterable_1 extends { [asyncIterator]: () => AsyncIterator<EntryOf<WindowOpenPromiseFeatures>, any, undefined> } ? { [asyncIterator]: () => AsyncIterableIterator<string> ; next: (…args: [] | [undefined]) => Promise<IteratorResult<string, any>> ; return?: (value?: any) => Promise<IteratorResult<string, any>> ; throw?: (e?: any) => Promise<IteratorResult<string, any>> } : { [iterator]: () => IterableIterator<string> ; next: (…args: [] | [undefined]) => IteratorResult<string, any> ; return?: (value?: any) => IteratorResult<string, any> ; throw?: (e?: any) => IteratorResult<string, any> }

Maps array of feature entries to valid values.

Type parameters

Name	Type
Iterable_1	extends IsomorphicIterable<EntryOf<WindowOpenPromiseFeatures>>

Parameters

Name	Type
iterable	Iterable_1

Returns

Iterable_1 extends { [asyncIterator]: () => AsyncIterator<EntryOf<WindowOpenPromiseFeatures>, any, undefined> } ? { [asyncIterator]: () => AsyncIterableIterator<string> ; next: (…args: [] | [undefined]) => Promise<IteratorResult<string, any>> ; return?: (value?: any) => Promise<IteratorResult<string, any>> ; throw?: (e?: any) => Promise<IteratorResult<string, any>> } : { [iterator]: () => IterableIterator<string> ; next: (…args: [] | [undefined]) => IteratorResult<string, any> ; return?: (value?: any) => IteratorResult<string, any> ; throw?: (e?: any) => IteratorResult<string, any> }

Array of formatted features.

Example

featureMap([
	["top", "10"],
	["left", "10"],
	["resizable", true],
]); // ["top=10", "left=10", "resizable=1"]

View source

---

featureParser

▸ featureParser(features?): string

Parses features object into features string.

Parameters

Name	Type	Description
features	WindowOpenPromiseFeatures	Features object.

Returns

string

Parsed string.

Example

featureParser({
	top: 10,
	left: 10,
	resizable: true,
}); // "top=10,left=10,resizable=1"

View source

---

windowOpenPromise

▸ windowOpenPromise(window): (options: WindowOpenPromiseOptions) => Promise<Window>

Promised Window.open.

Parameters

Name	Type	Description
window	Readonly<Pick<Window, "open">>	Window object (or maybe a mock ).

Returns

fn

Curried function with window in context.

▸ (options?): Promise<Window>

Curried function with window set.

Parameters

Name	Type	Description
options	WindowOpenPromiseOptions	WindowOpenPromise options.

Returns

Promise<Window>

Promise with new window.

Example

const windowOpen = windowOpenPromise(window);
windowOpen({
	url: "https://example.com",
	top: 10,
	left: 10,
})
	.then(newWindow => {
		newWindow.console.log("This will log in the new window.");
		newWindow.addEventListener("beforeunload", _event => {
			console.log("This will log when the new window is closed.");
		});
	})
	.catch(_error => {
		console.error("This will log if the new window can't be opened.");
	});

Example

const windowOpen = windowOpenPromise(window);
windowOpen({
	url: "https://example.com",
	top: 10,
	left: 10,
})
	.then(newWindow => {
		newWindow.console.log("This will log in the new window.");
		newWindow.addEventListener("beforeunload", _event => {
			console.log("This will log when the new window is closed.");
		});
	})
	.catch(_error => {
		console.error("This will log if the new window can't be opened.");
	});

View source