Select to view content in your preferred language

WebAppBuilder bug with custom icons on widgets and IE

1607
2
03-05-2019 12:22 PM
JoshuaDalton
Occasional Contributor

So, I built a webapp, and it had plenty of widgets and they all were fine in Firefox and IE 11, until, I added custom icons on my query widgets to help users know which layer they'd be querying.  In Firefox, everything still worked perfectly.

in IE 11, the page gives that loading 3-bar pulsing icon, after beginning to load and display the basemap etc.  (so not your standard security issue that halts the whole thing at blue background).

So, I dug deeper, and IE gives an exception in BaseLayoutManager, giving me some access denied warning.

Error: Access is denied.
   at b.set (https://js.arcgis.com/3.26/init.js:162:47
   at b.set (https://js.arcgis.com/3.26/init.js:161:365)
   at b.create (https://js.arcgis.com/3.26/init.js:159:353)
   at postCreate (https://mysite.com/myappsfolder/myapp/jimu.js/OnScreenWidgetIcon.js?wab_dv=2.10:32:7)
   at create (https://js.arcgis.com/3.26/init.js:356:356)
   at postscript (https://js.arcgis.com/3.26/init.js:355:99)
   at Anonymous function (https://js.arcgis.com/3.26/init.js:201:127)
   at _createOnScreenWidgetIcon (https://mysite.com/myappsfolder/myapp/jimu.js/layoutManagers/BaseLayoutManager.js?wab_dv=2.10:341:7)
   at loadOnScreenWidget (https://mysite.com/myappsfolder/myapp/jimu.js/layoutManagers/BaseLayoutManager.js?wab_dv=2.10:199:9)
   at Anonymous function (https://mysite.com/myappsfolder/myapp/jimu.js/layoutManagers/BaseLayoutManager.js

So... what was going wrong?  Inside the downloaded app folder myapp\config.json file, are the following lines

      {
        "position": {
          "left": 55,
          "top": 45,
          "relativeTo": "map"
        },
        "placeholderIndex": 1,
        "id": "_5",
        "name": "Query",
        "version": "2.10",
        "closeable": true,
        "uri": "widgets/Query/Widget",
        "config": "configs/Query/config__5.json",
        "label": "SoAndSo Report",
        "icon": "configs\\Query\\icon__5.png"
      },

where the line pointing the app to the png file I chose uses the wrong slashes.

"icon": "configs\\Query\\icon_5.png"

should be:

"icon": "configs/Query/icon_5.png"

I'm not sure why Firefox is fine with this, but IE is not, but it seems to be true, because after I changed it to use / instead of \\, both IE and Firefox are functional, and my app loads.

Just wanted to share this, and request the dev team check into changing the webappbuilder code to put the file location in with the correct slash in the next WAB build.

Thanks,

-Josh Dalton

0 Kudos
2 Replies
RobertScheitlin__GISP
MVP Emeritus

Joshua,

  Sorry you missed this thread before you had to go through this issue yourself:

https://community.esri.com/thread/228975-web-appbuilder-dev-edition-24-widgets-not-loading-in-ie-11 

0 Kudos
JoshuaDalton
Occasional Contributor

Thank you Robert, that was a very quick response, and I appreciate it.  Glad to see this is known issue, is there a plan to fix the file path naming when saving to config file in next webappbuilder?  I was fortunate that I had released previous versions of my app and used with IE already, so I knew the issue was isolated to just the icons, and that's also why I put so much of the error text into my post so others could find it no matter which terms they searched with, but others may not realize the icons are the problem.

If this goes back to 2.4, can we pressure the devs to issue a change in the builder to use the correct slashes?  It's clearly not going away any time soon in IE, given the rate of enterprise patching.

Here's the deeper link from the thread you posted, very informative, thanks!

Error: Unable to load Web AppBuilder applications or various image errors in Internet Explorer after... 

-Josh Dalton

0 Kudos