I am stuck in the middle of a bug. I began to use BrowserStack to validate my current project against Windows IE and EDGE and I got a particular issue with IE 11.
I first got an issue that I solved which was that FormData did not have any .get() methods, and I used the NPM formdata-polyfill for that.
I am working on a native JS login form, using FormData and XMLHTTPRequest, and it seems that the AJAX call is not firing at all.
When clicking on the submit button, instead of sending to my particular login URL, the POST request is fired to the current page itself.
So, obviously, no event is catched and no JavaScript is executed.
My JavaScript is compiled using WebPack, and the lines I use to get the login form and attach proper events to it are the following :
var formLogin = document.querySelector( "#form-login" );
if ( formLogin !== null )
{
var email = document.getElementById( "email" );
formLogin.addEventListener( "submit", _.validateLoginForm );
_.formInstance.init( formLogin );
_.inputUtil.disableField( '#btn-submit-email' );
_.inputUtil.disableField( '#btn-submit-password' );
utils.addAndDispatchEvent( '#email', 'input', _.inputUtil.disableSubmitIfFieldIsEmpty( '#btn-submit-email' ) );
utils.addAndDispatchEvent( '#password', 'input', _.inputUtil.disableSubmitIfFieldIsEmpty( '#btn-submit-password') );
email.addEventListener( "invalid", _.onInvalidEmail );
}
```
The JS file is properly loaded to.
I do not get where it can come from as it works well on any others browsers ( including Edge after I got the polyfill ).
If you have any ideas, let me know !
Thanks for listening.