Storefront js plugin callback function

Shopware 6 (German) Programmierung
1

In den Shopware Javascript Plugins werden Callback-Funktionen angelegt:

this.$emitter.publish('beforeSomething');

Wie kann ich die jetzt in meinem Plugin subsciben?

2

Die Events, auf die ich eine Callback Funktion anwenden möchte, sind in Resources\app\storefront\src\plugin\header\search-widget.plugin.js

this.$emitter.publish('afterSuggest'); und this.$emitter.publish('clearSuggestResults');

Folgendes habe ich:

import Plugin from 'src/plugin-system/plugin.class';

export default class MyPlugin extends Plugin {

    _afterSuggest(event) {
        console.log('MyPlugin._afterSuggest()'); // wird nicht ausgegeben
    }

    _clearSuggestResults(event) {
        console.log('MyPlugin._clearSuggestResults()'); // wird nicht ausgegeben
    }

    init() {
        console.log('MyPlugin.init()'); // wird ausgegeben
        var d = document.$emitter.subscribe('clearSuggestResults', this._clearSuggestResults.bind(this));
        console.log(d); // true
        d = document.$emitter.subscribe('afterSuggest', this._clearSuggestResults.bind(this));
        console.log(d); // true
    }
}

Leider wird hier nur init() und nicht _afterSuggest() und _clearSuggestResults() ausgeführt. d ist in beiden fällen true. Was mache ich falsch?

3

Hier nochmal das Plugin:

import Plugin from 'src/plugin-system/plugin.class';

export default class SmartSearchPlugin extends Plugin {

    static options = {
        smartSearchEventStart: 'afterSuggest',
        smartSearchEventEnd: 'clearSuggestResults'
    };

    _searchStart(event) {
        console.log('SmartSearchPlugin._searchStart()');
    }

    _searchEnd(event) {
        console.log('SmartSearchPlugin._searchEnd()');
    }

    init() {
        console.log('SmartSearchPlugin.init()'); // wird ausgegeben

        document.$emitter.subscribe(
            this.options.smartSearchEventStart,
            this._searchStart.bind(this)
        );

        document.$emitter.subscribe(
            this.options.smartSearchEventEnd,
            this._searchEnd.bind(this)
        );
    }
}

Ich möchte einfach einen Trigger, wenn das Live-Suchergebnis ausgespielt bzw. wieder geschlossen wurde. Leider werden die beiden Events aber komplett ignoriert, wenn ich in der Storefront die Suche betätige.

Der Storefront build ist auch korrekt:

(window.webpackJsonp=window.webpackJsonp||[]).push([["smart-search"],{"s+w2":function(e,t,n){"use strict";function r(e){return(r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}function o(e,t){for(var n=0;n

Ich komme hier grade überhaupt nicht weiter und würde mich freuen, wenn jemend einen Hinweis hat.

4

Alles klar, jetzt habe ich es.

Da $emitter auf die Plugin-Instanz (this.$emitter.publish(...) published, muss ich auch auf die Instanz subscriben:

var searchWidgetPlugin = PluginManager.getPluginInstances('SearchWidget');
if(searchWidgetPlugin.length > 0){
    searchWidgetPlugin[0].$emitter.subscribe(
        this.options.smartSearchEventStart,
        this._searchStart.bind(this)
    );
    searchWidgetPlugin[0].$emitter.subscribe(
        this.options.smartSearchEventEnd,
        this._searchEnd.bind(this)
    );
}