How to make the Javascript part of a filter asynchronous

[n-peugnet]

I am developing an extension for Flarum and I need to make an asynchronous function call in the Javascript part of a filter.

I configured a new TextFormatter tag like so:

protected function configureCrossReferenceShort(Configurator $config)
{
    $tagName = 'CROSSREFERENCESHORT';

    $tag = $config->tags->add($tagName);
    $tag->attributes->add('id')->filterChain->append('#uint');
    $tag->attributes->add('title');
    $tag->template = '
        <a href="{$DISCUSSION_URL}{@id}" class="DiscussionLink">
            <xsl:value-of select="@title"/> <xsl:if test="$SHOW_DISCUSSION_ID = 1">
                <span class="DiscussionId">#<xsl:value-of select="@id"/></span>
            </xsl:if>
        </a>';

    $tag->filterChain
        ->prepend([static::class, 'filterCrossReferences'])
        ->setJS('flarum.extensions["club-1-cross-references"].filterCrossReferences');
    $config->Preg->match('/\B#(?<id>[0-9]+)\b/i', $tagName);
}

(I took inspiration from Flarum's mention extension)

How can I use the result of an asynchronous Javascript call in filterCrossReferences ? I tried to return a Promise but it does not seem to be supported.

[JoshyPHP]

You can't have asynchronous filters, as the rest of the parsing depends on whether the current tag/attribute is valid. You'll have to make your filter synchronous.

If your filter depends on the result of a slow resource (e.g. fetching references from a remote database) I suggest you store the results in a local cache, return false on a miss while you fetch new data, then trigger a refresh of the preview when new data is available.

[n-peugnet]

Thank you for your insights. unfortunately I can't seem to find a way to refresh the preview of Flarum. I will have to ask there.

[JoshyPHP]

Yeah, doesn't look like that part of the composer is exposed to the public at the moment. In the meantime, you can probably call s9e.TextFormatter.preview() manually until there's an official interface for it.

https://github.com/flarum/framework/blob/fe8480c8f73214ce7a5bc66792d74f5646692244/framework/core/js/src/forum/components/ComposerPostPreview.js#L27-L49