How to use element-ready - 10 common examples

async function init(): Promise {
	const marketPlaceLink = (await elementReady('.Header-link[href="/marketplace"]'));
	if (marketPlaceLink) {
		// The Marketplace link seems to have an additional wrapper that other links don't have https://i.imgur.com/KV9rtSq.png
		marketPlaceLink.closest('.border-top, .mr-3')!.remove();
	}

	await domLoaded;

	select.last('.header-nav-current-user ~ .dropdown-divider')!.before(
		<div></div>,
		<a href="/marketplace">Marketplace</a>
	);
}

export async function insertPullrequestTemplate(template: string) {
    const defaultEditor = elementReady('textarea[id="id_description"]')
    const atlassianEditor = elementReady(
        '#ak_editor_description div[contenteditable="true"]'
    )
    const editorPromises = [defaultEditor, atlassianEditor]
    const editor = await Promise.race(editorPromises)
    // $FlowIgnore Resolve when `element-ready` libdefs have `p-cancelable` libdefs
    editorPromises.forEach(p => requestAnimationFrame(() => p.cancel()))

    if (editor instanceof HTMLTextAreaElement) {
        editor.value = template
    } else if (editor instanceof HTMLDivElement) {
        const html = marked(template)
        editor.innerHTML = html
    } else {
        console.warn(
            'refined-bitbucket(pullrequest-template): Could not find pull request editor.'
        )

export async function insertPullrequestTemplate(template: string) {
    const defaultEditor = elementReady('textarea[id="id_description"]')
    const atlassianEditor = elementReady(
        '#ak_editor_description div[contenteditable="true"]'
    )
    const editorPromises = [defaultEditor, atlassianEditor]
    const editor = await Promise.race(editorPromises)
    // $FlowIgnore Resolve when `element-ready` libdefs have `p-cancelable` libdefs
    editorPromises.forEach(p => requestAnimationFrame(() => p.cancel()))

    if (editor instanceof HTMLTextAreaElement) {
        editor.value = template
    } else if (editor instanceof HTMLDivElement) {
        const html = marked(template)
        editor.innerHTML = html
    } else {
        console.warn(
            'refined-bitbucket(pullrequest-template): Could not find pull request editor.'

async function init() {
	[options] = await Promise.all([
		new OptSync().getAll(),
		elementReady('.ajax-pagination-form')
	]);

	apply($('.account-switcher + *') || $('.news.column > :first-child'));

	const pages = [];

	// Prefetch all pages in parallel
	for (let i = 0; i < options.preloadPagesCount; i++) {
		pages.push(requestPage(i + 2));
	}

	// Append pages in series
	// uses the same method used by GitHub
	for (const page of pages) {
		// eslint-disable-next-line no-await-in-loop
		const updates = await page;

export default async function pullrequestCommitAmount() {
    const prNode = await elementReady('#pullrequest')
    const prId = prNode.dataset.localId

    const pullrequestCommits = await api.getPullrequestCommits(prId)

    // eslint-disable-next-line eqeqeq, no-eq-null
    if (pullrequestCommits && pullrequestCommits.size != null) {
        const badge = (
            <span class="__rbb-commit-ammount">{pullrequestCommits.size}</span>
        )
        const commitsLink: HTMLElement = (document.getElementById(
            'pr-menu-commits'
        ): any)
        commitsLink.appendChild(badge)
    }

    return prNode

async function init(): Promise {
	const exploreLink = await elementReady('.Header-link[href="/explore"]');
	if (!exploreLink) {
		return false;
	}

	exploreLink.before(
		<a data-hotkey="g t" href="/trending">Trending</a>
	);
}

async function init(): Promise {
	const element = await elementReady('.branch-name');
	if (element) {
		const branchUrl = `/${getRepoURL()}/tree/${element.textContent!}`;
		wrap(element.closest('.branch-name')!, <a href="{branchUrl}"></a>);
	}
}

async function removeBrackets(selector) {
  const found = await elementReady(selector)
  if (!found) return

  for (const element of select.all(selector)) {
    const html = element.innerHTML

    if (html.startsWith('(')) {
      element.innerHTML = html.replace(/^\(|\)$/g, '')
    }
  }
}

async function transitionToGrid () {
  const promise = await elementReady('.list')

  if (promise) {
    let jsLoader = document.querySelector('.js-loader')
    jsLoader.classList.add('has-loaded')
    jsLoader.addEventListener('animationend', () => {
      jsLoader.remove()
      jsLoader = null
    }, { once: true })
  }
}

async function extractUserIdFromMeta() {
    const meta = await elementReady('meta[name="author"]')

    if (meta) {
      const rawValue = meta.getAttribute('content')

      return rawValue.match(/\((.+)\)$/)[1]
    }
  }