Contact form 7 js actions don't fire if jQuery.form.js added to main.js

sage
1

I’m using several forms on the site via contact form 7.

Trying to include any js needed into the compiled main.js but for some reason its not picked up by contact form 7 when you interact with the forms. ie none of js validation takes place.

i excluded cf7 default styles & js using

add_filter( 'wpcf7_load_js', '__return_false' );
add_filter( 'wpcf7_load_css', '__return_false' );

added query-form like so.

   "dependencies": {
    "jquery": "~2.1.4",
    "tether": "~1.1.1",
    "bootstrap": "v4.0.0-alpha.2",
    "imagesloaded": "~4.1.0",
    "jquery.scrollTo": "~2.1.2",
    "waypoints": "jquery-waypoints#^4.0.0",
    "jquery-ui": "^1.11.4",
    "Stickyfill": "^1.1.4",
    "jquery.localScroll": "^1.4.0",
    "bower": "*",
    "install": "^1.0.4",
    "jquery.serialscroll": "jquery.serialScroll#^1.3.1",
    "font-awesome": "fontawesome#^4.6.3",
    "vide": "^0.5.0",
    "jquery-form": "^3.46.0"
  },

It is compiled into the main.js file and can see it there. Is there anything i can do to help wpcf7 see it in main.js?

2

Do you get an error in the console? Is it possible that CF7 namespaces their copy of jquery-form to avoid conflicts? Or that main.js is being included later than CF7 needs it to be?

3

no errors during compiling or during use.

How could i check if they namespace wpcf7?

thanks, D.