The module Amasty_HidePrice overrides mage/validation
by using a mixin. But this mixin has a bug and I need to fix it by overriding the mixin with my own mixin.
This is the original mixin (shortened to only show relevant parts):
vendor\amasty\module-hide-price\view\frontend\requirejs-config.js:
var config = {
config: {
mixins: {
'mage/validation': {
'Amasty_HidePrice/js/validation-mixin': true
}
}
}
};
I tried to override it like this:
app\code\Company\Newsletter2Go\view\frontend\requirejs-config.js
var config = {
config: {
mixins: {
'mage/validation': {
'Company_Newsletter2Go/js/validation-mixin': true,
}
}
}
};
app\code\Company\Newsletter2Go\etc\module.xml
<?xml version="1.0" ?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Module/etc/module.xsd">
<module name="Company_Newsletter2Go" setup_version="1.0.0">
<sequence>
<module name="Amasty_HidePrice"/>
</sequence>
</module>
</config>
Now I added console.log("original mixin");
to the original mixin and console.log("custom mixin")
to my override.
But it shows both, and the override does not work, the old code is still used.
original mixin
custom mixin
I also tried to use map, but it still loads the original method:
var config = {
config: {
map: {
"*": {
"Amasty_HidePrice/js/validation-mixin": "Company_Newsletter2Go/js/validation-mixin"
}
}
}
};
I even tried to override it, by putting the script into my theme folder at THEME/Amasty_HidePrice/web/js/validation-mixin.js but it does still load the original file.
Current State:
app\code\Company\Newsletter2Go\etc\module.xml
<?xml version="1.0" ?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Module/etc/module.xsd">
<module name="Company_Newsletter2Go" setup_version="1.0.0">
<sequence>
<module name="Company_Base"/>
<module name="Magento_Newsletter"/>
<module name="Magento_Customer"/>
<module name="Amasty_HidePrice"/>
</sequence>
</module>
</config>
app\code\Company\Newsletter2Go\view\frontend\requirejs-config.js
var config = {
config: {
mixins: {
'mage/validation': {
'Amasty_HidePrice/js/validation-mixin': false,
'Company_Newsletter2Go/js/validation-mixin': true,
}
}
}
};
app\code\Company\Newsletter2Go\view\frontend\web\js\validation-mixin.js
define([
'jquery'
], function ($) {
'use strict';
return function (widget) {
$.widget('mage.validation', widget, {
listenFormValidateHandler: function (event, validation) {
console.log("override loaded");
// I removed the rest of the code, for easier debugging
}
});
return $.mage.validation;
};
});
vendor\amasty\module-hide-price\view\frontend\web\js\validation-mixin.js
define([
'jquery'
], function ($) {
'use strict';
return function (widget) {
$.widget('mage.validation', widget, {
listenFormValidateHandler: function (event, validation) {
console.log("original loaded");
// I removed the rest of the code, for easier debugging
}
});
return $.mage.validation;
};
});
vendor\amasty\module-hide-price\view\frontend\requirejs-config.js
var config = {
map: {
'*': {
'amasty-fancyambox' : 'Amasty_HidePrice/js/fancyambox/jquery.fancyambox.min'
}
},
config: {
mixins: {
'mage/validation': {
'Amasty_HidePrice/js/validation-mixin': true
},
'Magento_Swatches/js/swatch-renderer': {
'Amasty_HidePrice/js/swatch-renderer-mixin': true
}
}
}
};
Result
Uncaught TypeError: base is not a constructor
at Function.$.widget (widget.js:75)
at validation-mixin.js:5
at mixins.js:105
at Array.forEach (<anonymous>)
at applyMixins (mixins.js:104)
at mixins.js:129
at Object.execCb (require.js:1650)
at Module.check (require.js:866)
at Module.<anonymous> (require.js:1113)
at require.js:132
More Informations about the solution: