nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Web App Builder Version 2.7 - A Bug with 2D Jewelry Box Widget Icon Placement?

ipeebles

I have downloaded and installed the latest Web App Builder (WAB) version 2.7. When building an application and testing, I have noticed strange behavior with the icons that I did not have with version 2.6. I can make simple customizations, that work and have no errors or any issues in version 2.6, but there are issues in 2.7. Here is an example:

When the application loads (notice black lines over search widget):

When the application loads

The widgets are hidden over the search widget.

When the application is refreshed our the page size changes

After resizing the browser to full extent or refresh

There is something strange going on here. There are no errors in console mode and the issue has been replicated in Microsoft Internet Explorer 11 and Mozilla FireFox.

Trouver plus de publications taguées avec

Accepted answers

All comments

ipeebles

I upgraded to WAB 2.8 a couple of months ago. Do not notice any issues. Might be the best option for those who experience the issue at this point.

LefterisKoumis

Hello Greg. I had similar issues with 2.7 but not with 2.8.

GregRieck

Thank you for your continued help on this issue. I do not want to change themes. I use the slide out window for the editor.

postCreate: function() {

this.inherited(arguments);

this._processGroupSetting();

this.switchableElements.title = this.titleNode;

this.switchableElements.links = this.linksNode;

this.switchableElements.subtitle = this.subtitleNode;

this._handleTitleColorAndLogoLink(this.appConfig);

if (this.position && this.position.height) {

this.height = this.position.height;

}

// if (!this.appConfig.portalUrl) {

html.setStyle(this.signInSectionNode, 'display', 'none');

// } else { // html.setStyle(this.signInSectionNode, 'display', '');

// }

if (this.appConfig && this.appConfig.logo) {

this.logoNode.src = this.appConfig.logo;

html.removeClass(this.logoNode, 'hide-logo');

} else {

this.logoNode.src = "";

html.addClass(this.logoNode, 'hide-logo');

}

this.switchableElements.title.innerHTML = utils.sanitizeHTML(this.appConfig.title ? this.appConfig.title : ''); this.switchableElements.subtitle.innerHTML = utils.sanitizeHTML(this.appConfig.subtitle ? this.appConfig.subtitle : ''); this._createDynamicLinks(this.appConfig.links);

this._setElementsSize();

this.own(on(this.domNode, mouse.enter, lang.hitch(this, function() {

var title = '';

var portalUrl = this.appConfig && this.appConfig.portalUrl || '';

var server = portalUrlUtils.getServerByUrl(portalUrl);

if (portalUrlUtils.isArcGIScom(server)) {

server = 'ArcGIS.com';

} if (server) {

title = this.nls.signInTo + ' ' + server;

}

this.signinLinkNode.title = title;

})));

window._absolutLayoutManager.resize();

RobertScheitlin__GISP

Greg,

Place it in the postCreate of the HeaderController widget.

Aaron_Leese

I can't think of somewhere off the top of my head that would automatically execute it. Have you considered switching to the foldable theme instead of the jewelry box theme as an alternative? I've not experienced this odd behavior with the foldable theme, and the two themes are very similar other than the slide out window.

: : : : : : : : : : : : : : : : : : : : : : : : :

Aaron T. Leese

Data Scientist – Data Analytics & Insights

GregRieck

This is a great solution and has worked for me where I have a sidebar widget. However, now I have a site without a sidebar widget. This site is a view only site. I still want to display widgets in the header for basemap, legend and layer list. But, because of this bug etc. they don't display. Where would I put your suggested "window._absolutLayoutManager.resize();" so that it is executed?

LefterisKoumis

Thank you! Yes, it fixed it.

Aaron_Leese

no, I added it to the widget that's in the sidebar of the webapp (my app is using Robert's popup panel). I figure that widget gets created on the startup of the application, so it will fire after the user opens the webapage.

LefterisKoumis

Hello Aaron. Did you mean that you added the suggested line in the app/themes/jewelryboxtheme/widgets/headercontroller/widget.js?

Thanks.

Aaron_Leese

I was having the same issue. I noticed that if I resized the window, the widget icons would get reset to their correct locations. I added

window._absolutLayoutManager.resize();

to the end of the postCreate funtion of the widget that I have in the slide out window of the jewelry box theme and it makes the widget icons in the header controller appear in the correct positions

hope this helps!

LefterisKoumis

It is frustrating when you access the ESRI's web-appbuilder developer webpage for bugs and they have no entries for reported bugs since last year!!!

Esri Support Search-Results

Click on the link above and select "Past Year" from the "SORT" dropdown. You will see reported bugs only if you select "Any time" but the bugs are for older versions of WAB.

ipeebles

One thing I have noticed is if you use an application link at the top of the main toolbar or change the font (default font to arial), that behavior will appear. However, if you remove the link, it seems to be OK. I am headed to the Developer Summit in March and I will track down the WAB guys to talk to them about this issue. I did go ahead and deploy all of our WAB apps to the latest version.

RobertScheitlin__GISP

It is now a known issue in 2.7 when using the Foldable or Jewlerybox themes.

LefterisKoumis

I have problems using this theme as well. The icons for the widget groups don't appear below where they are supposed to be...

I never had problems updating an app from one version of WAB to the newer version, but this time there is an obvious issue.

ipeebles

Robert, I am actually glad you mentioned this . I was hoping I wasn't the only one. I did contact ESRI this morning and was able to demonstrate the issue and they are looking into it. It is almost as if something isn't loading properly. I do not see this behavior in version 2.6. I am headed to the Dev Summit in March in Palm Springs, CA, so hopefully I find ESRI staff to talk to about this issue. Just wish there was a quick fix, but I cannot deploy an app in this type of condition because end users will notice.

RobertScheitlin__GISP

I have seen where a few people have mentioned this. I am not sure if anyone have reported this bug to seri tech support though.

Rejoindre la conversation

Les membres connectés peuvent publier, suivre les mises à jour, et plus encore. Nouveau ici ? Inscrivez-vous gratuitement.

Liens rapides

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.