Can't make it work with webpack in an app where jQuery is already injected

[afaya-partssource]

:information_source: If you have a question, please post it on the Okta Developer Forum instead. Issues in this repository are reserved for bug reports and feature requests.

I'm submitting a

• [X] bug report
• [ ] feature request

Background info

We have a React app already configured and working with webpack. This app has already a jquery dependency:

"jquery": "3.4.1",

That jquery is both exposed with expose-loader and loaded with ProvidePlugin:

module: { rules: [ ... { test: require.resolve("jquery"), loader: "expose-loader", options: { exposes: ["$", "jQuery"], }, ... ] }, plugins: [ ... new webpack.ProvidePlugin({ $: "jquery", jQuery: "jquery", }), ]

When adding the okta-sign-widget, webpack fails to build. Seems an error related to conflicts in the jQuery version and we can't find a way to fix this

Expected behavior

That we can add and use signin widget with webpack without any major problem

What went wrong?

Webpack error log [0] TypeError: r.default.ajaxSetup is not a function [0] at Object.call (C:\MyApp\node_modules\@okta\okta-signin-widget\dist\js\webpack:\webpack:\node_modules\@okta\courage\src\util\jquery-wrapper.js:4:1) [0] at webpack_require__ (C:\MyApp\node_modules\@okta\okta-signin-widget\dist\js\webpack:\webpack:\webpack\bootstrap f7e6bda01b7d30b21656:19:1) [0] at Object.call (C:\MyApp\node_modules\@okta\okta-signin-widget\dist\js\webpack:\webpack:\node_modules\@okta\courage\src\models\SchemaProperty.js:2:1) [0] at webpack_require (C:\MyApp\node_modules\@okta\okta-signin-widget\dist\js\webpack:\webpack:\webpack\bootstrap f7e6bda01b7d30b21656:19:1) [0] at Object.call (C:\MyApp\node_modules\@okta\okta-signin-widget\dist\js\webpack:\webpack:\node_modules\@okta\courage\src\models\BaseSchema.js:4:1) [0] at __webpack_require (C:\MyApp\node_modules\@okta\okta-signin-widget\dist\js\webpack:\webpack:\webpack\bootstrap f7e6bda01b7d30b21656:19:1) [0] at Object.call (C:\MyApp\node_modules\@okta\okta-signin-widget\dist\js\webpack:\webpack:\src\CourageForSigninWidget.js:3:1) [0] at __webpack_require__ (C:\MyApp\node_modules\@okta\okta-signin-widget\dist\js\webpack:\webpack:\webpack\bootstrap f7e6bda01b7d30b21656:19:1) [0] at Object.call (C:\MyApp\node_modules\@okta\okta-signin-widget\dist\js\webpack:\okta-sign-in.entry.js:6696:20) [0] at t (C:\MyApp\node_modules\@okta\okta-signin-widget\dist\js\webpack:\webpack:\webpack\bootstrap f7e6bda01b7d30b21656:19:1)

Steps to reproduce

If the current behavior is a bug, please provide the steps to reproduce and a minimal demo if possible (you can use this template as a starting point: https://jsfiddle.net/m2gyLq4v/).

Your environment

• Okta Sign-In Widget Version: tried 5.5.0 and 5.7.0
• Browser: all
• OS: Windows 10
• Language: English

[afaya-partssource]

Just as an update, if I do remove the ProvidePlugin and expose-loader stuff from webpack (which I did just for testing), I still get the same error

[afaya-partssource]

For reference, webpack versions "webpack": "^4.29.0", "webpack-cli": "^3.3.10"

[jayjayzheng]

any update on this? I am experiencing the same issue on jquery3.5.14 and okta-sign-in-widget 6.5.0