Extend plugin javascript file from another plugin

Question

Is it possible in Shopware 6 to extend plugins with another plugin? I have plugin A from the shopware store, I need to change its functionality a bit, because it does not quite suit me. This plugin overrides core functionality of shopware - ListingPlugin from src / plugin / listing / listing.plugin. I need to get the js file from plugin A from my plugin B or from theme. I didn't find any information on this functionality from documentation

Answer 1

You can extend the plugin like

import ExtendPlugin from './plugin/youtPluignFolder/extend-plugin.plugin';

const PluginManager = window.PluginManager;
PluginManager.override('OrgPlugin', ExtendPlugin);

...

After register the file you need to create the file. There you can extend or overwrite the function like

import OrgPlugin from '/app/custom/plugins/pluginName/path/to/plugin-file.plugin';

export default class ExtendPlugin extends OrgPlugin {
    init() {
        super.init();
    }

    // Function you want overwrite or extend
    function () {
      //    your code
    }
}

Answer 2

I tried something like that. In this case, it isn't working. I created register for this plugin:

import TanmarInfiniteScrollingExtend from './infinite-scrolling-extend/infinite-scrolling.plugin';

const PluginManager = window.PluginManager;

PluginManager.override('TanmarInfiniteScrolling', TanmarInfiniteScrollingExtend, '[data-listing]');

And then created the file with this code:

import TanmarInfiniteScrolling from 'src/infinite-scrolling/infinite-scrolling.plugin';

export default class TanmarInfiniteScrollingExtend extends TanmarInfiniteScrolling {
    init() {
        super.init();
    }
    _tmisInit() {
        super._tmisInit();
        console.log('Hello world')

    }
}

But when I tried to build a storefront, I got the error:

https://i.stack.imgur.com/mQ7Rt.png

Probably the reason for that is because the parent plugin extends Listing Plugin.

PluginManager.override('Listing', TanmarInfiniteScrolling, '[data-listing]');

But when I tried to override ListingPlugin, the parent plugin is completely overwritten.

This is a structure of the file in parent plugin: https://i.stack.imgur.com/9dDXL.png

Answer 3

You can achieve this with relative paths like ../../../../../../../ExternalPluginName/src/Resources/app/storefront/src/externalplugin/externalplugin.plugin