Rewrite js method issue with mixins

Question

I would like to rewrite this method: grabEmail from a third-party module:

define([
    'jquery',
    'uiElement',
    'underscore',
    'rjsResolver',
], function ($, Element, _, resolver) {
    'use strict';

    return Element.extend({
        defaults: {
            isNeedLogEmail: false,
            grabEmailUrl: '',
            grabEmailDelay: 500,
            emailInputSelector: '#customer-email'
        },

        initialize: function () {
            this._super();
            resolver(function () {
                this.initEventListeners()
            }.bind(this));

            return this;
        },

        initEventListeners: function () {
            $(this.emailInputSelector).on('keyup', _.debounce(this.grabEmail.bind(this), this.grabEmailDelay));
        },

        grabEmail: function () {
            var emailInputElement = $(this.emailInputSelector),
                grabbedEmail = emailInputElement.length ? emailInputElement.val() : false,
                isEmailValid = $.validator.methods['validate-email'](grabbedEmail);
            if (isEmailValid && this.isNeedLogEmail) {
                $.ajax({
                    url: this.grabEmailUrl,
                    method: 'POST',
                    global: false,
                    data: { email: grabbedEmail }
                });
            }
        }
    });
});

This is the location of the original class: vendor/third/party/view/frontend/web/js/grabemail.js . This is my requirejs-config.js content:

var config = {
    config: {
        mixins: {
            'Third_Party/grabemail': { 'Vendor_Customer/grabemail':true }
        }
    }
};

in my app/code/Vendor/Customer/view/frontend/web/js/grabemail.js, I have:

define(['jquery'], function ($) {
    'use strict';

    return function (target){
        return target.extend({
            grabEmail: function (){
                alert('Hello');
                this._super();
            },
        });
    };
});

For some reason I don't see my alert message. No js errors in the console as well. Do you know what am I doing wrong ? Why my rewrite for the grabEmail method, doesn't work ?

Thanks in advance for any suggestions!

Answer 1

You can try:

var config = {
    config: {
        mixins: {
            'Third_Party/js/grabemail.js': { 'Vendor_Customer/grabemail':true }
        }
    }
};