https://github.com/hypersoftllc/qc-inject-element
A promise-based Element injection utility. Great for injecting img, link, and script elements.
https://github.com/hypersoftllc/qc-inject-element
Last synced: about 1 month ago
JSON representation
A promise-based Element injection utility. Great for injecting img, link, and script elements.
- Host: GitHub
- URL: https://github.com/hypersoftllc/qc-inject-element
- Owner: hypersoftllc
- License: isc
- Created: 2020-03-14T19:39:13.000Z (over 6 years ago)
- Default Branch: develop
- Last Pushed: 2020-03-15T01:27:44.000Z (over 6 years ago)
- Last Synced: 2025-10-06T16:44:36.007Z (10 months ago)
- Language: JavaScript
- Homepage:
- Size: 8.79 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# @qc/inject-element
A promise-based `Element` injection utility. Great for injecting `img`, `link`, and `script` elements.
The promise resolves successfully after the resource successfully loads. The promise rejects if an error occurs while loading or if the loading times out.
## Syntax
```typescript
type CssSelector = string;
type NodeLike = CssSelector | Node;
type AttachAction = 'after' | 'before' | 'endof' | 'startof';
type AttachableString = AttachAction + '@' + CssSelector;
interface AttachableObject {
[AttachAction]: NodeLike;
}
type Attachable = AttachableString | AttachableObject;
```
See [@qc/attach-node](https://www.npmjs.com/package/@qc/attach-node) for examples of uses of `Attachable`s.
## Examples
```js
import injectElement from 'inject-element'
injectElement({
tag: 'script',
src: 'https://cdn.example.com/foobar.js',
attach: 'endof@body', // An `Attachable`.
})
.then((elmt) => {
// Do what is needed now that the dependency successfully loaded.
})
.catch((err) => {
console.error(err)
// Maybe notify user that something went wrong and should try refreshing.
})
injectElement({
tag: 'link',
href: 'https://cdn.example.com/foobar.css',
type: 'stylesheet',
attach: 'endof@head' // An `Attachable`.
})
```