Angular tabs re-ordering themselves onClick on newest version of Chrome - angularjs

In my AngularJS app, I'm using a custom tabs directive to create several clickable tabs. On the newest version of chrome (77.0.3865.90), clicking on of these tabs causes the clicked tab to unexpectedly re-order itself. (The tab, which was on the right before, slides all the way to the left). In addition, some tabs are being covered by other tabs.
Does anyone know if this is due to a regression in the newest version of chrome? I don't see this behavior in Firefox or Edge.

This is no longer an issue in my app. I'm assuming a chrome update fixed this issue.

Related

Material-UI IE11 Multiple Accordions - last chosen accordion won't close if I select a new one

I have implemented several expandable menus using MUI Accordion's. Their expansion is controlled through the "expanded" property. MUI release is 4.10.2.
In recent browsers each Accordion closes when I open one of the others. I have implemented this behavior through ClickAwayListener's that wrap the content of the AccordionDetails.
In IE11 this does not happen entirely. What I see is that the ClickAwayListener does not catch the mouse click on the sibling AccordionSummary's. Mouseclicks in all other parts of the page are caught correctly.
In all recent browsers the click on the sibling AccordionSummary is correctly used to open it, and then it arrives to the ClickAwayListener of the previously chosen menu (and closes it). In IE11 this does not happen.
I am not using preventDefault in any part of the page. No error message is reported to the IE11 console.
I have created a codesandbox that contains the minimal code that fails on my website:
https://codesandbox.io/s/cocky-galileo-gqxz9
Unfortunately this codesandbox page does not run in IE11, so the issue is not really reproducible.

angular-material bottom sheet issue with mobile browser?

this is my bottom-sheet its working properly in pc's browser and swipe-down event is doing well in it but in mobile's browser it starts reloading and I have to click out side for closing bottom sheet is there any other way to handle this situation?
Ok I got it Bottom-sheet will work properly if you add overflow-y to none in body element so it will prevent pull-to-refresh event !

angular-materialize DatePicker doesn't show on Edge browser, scrolls the page down on IE and Edge

I'm using angular-materialize for a demo project and so far it's been pretty easy to use. However, when doing a browser compatibility test pass I found that the datepicker component doesn't work when using IE and Edge browsers. On IE it scrolls the page down when the overlay appears and it doesn't even work on Edge browser. You can see the bugs on the angular-materialize demo page Open this link in IE or Edge.
Please refrain from answering this with a question like "Why not use Angular-Material". Although the UI is similar, there are some parts of materializecss that I prefer over Google's Angular-Material. So far, this is the only issue I've found.

How to inspect a Firefox WebExtension popup?

I'm trying to get a Google Chrome Extension to run as a Firefox Webextension. My original Problem is that the popup has no height. Besides that I could not for the life of me figure out how to inspect the DOM of the popup.
Btw the popup is just an HTML file and it is defined in browser_action.default_popup.
The bugs referenced in #minj's comment above are resolved in recent versions of Firefox. You can debug popups now. MDN explains it well; in brief...
enter about:debugging in the URL bar.
In the left-hand menu, click This Firefox (or This Nightly).
click Inspect next to your extension to open the "Extension Toolbox".
Check the option to "Disable Popup Auto-Hide" in the Extension Toolbox
then you select which HTML document you mean to debug (in this case it would be your popup HTML code) using the context switcher ("select an iframe as the currently targeted document")
After doing this, the popup stays on the screen and the inspector contains its HTML. I'm doing it now for the first time (in Firefox 49) and it's working well.
It's not currently possible since the popup closes automatically and there is no DOM view available. See bug 1236944 and bug 950936.
Popup sizing does not seem to work correctly in Firefox. There are a bunch of bugs related to it.

Drupal 7 Admin Overlay positioned to high

This is a problem that seems to have occurred for no reason. Everything was working fine, and now all of a sudden the overlay iframe for the admin interface renders too high so that any tabs are rendered underneath the toolbar. I hadn't edited any css or html so I don't see how I could have done this. Has anyone seen this happen, and how did they fix it? I'm attaching two images. One shows the site as it is (incorrectly). The other shows another similar site that is functioning correctly. Also, notice on the incorrect display, somehow the toolbar is showing OVER the browser scrollbar.
The problem is that I was swapping in JQuery 1.8.3 with hook_js_alter. This has a known problem causing this exact issue. I didn't need a later version of JQuery after all so I removed that, and it fixed the problem.

Resources