We Keep Coding

How to scroll a modal box in Selenium Python?

When I click on a link to accept Terms and conditions, a modal box pops up.
I need to scroll the modal pop up down, enable the Accept button and then click Accept.
I'm not able to scroll the modal box.
I tried:
context.driver.execute_script("arguments[0].scrollIntoView(true);", ars)
Where ars is the last element in the popup. This shows the last element ars in the modal without scrolling down.
I also tried:
actions = ActionChains(context.driver)
actions.move_to_element(ars)
This has the same behaviour: shows the last element ars in the modal without scrolling down.
Any other methods to scroll down are highly appreciated.
TIA

First try to find the new iframe which contains the name of the modal box.
modal_box = driver.find_element_by_xpath('/html/body/div[2]/div.....')
driver.execute_script("arguments[0].scrollTop = arguments[0].scrollHeight", modal_box)
Make sure its scrolling for the entire height. Then try to find the visibility of the accept button

Jquery can't seem to target contents of modal

I wish to append some content within form within a modal and so have created:
$('.simple_form').append("<p><a href='google.com'>Apply now</a></p>");
However, this does not appear to work -the HTML above deosnt not append, not do I see any errors in the console.
I can do other stuff on the page - append the text anywhere else, just not to part of the modal.
The site is using the Near Me platform, an example site of which is here: https://desksnear.me/
I am just trying to affect the modal that appears when you click Log In at the top right.
Would anyone know why this isn't working and what I could do to get back on track?

I think the modal gets created anew every time you click the Log In button. So the .simple_form changes get overwritten before they can be seen.
There isn't an ideal solution to this problem if you can't tap into an event that occurs when the modal is opened and all the content in it has been initialized. I would suggest using an interval to repeatedly check if the modal is visible (for some capped amount of time, in case something fails), and then insert your HTML code at that point.
$('.nav-link.header-second').click(function() {
var token = setInterval(function(modal) {
if (modal.hasClass('visible')) {
$('.simple_form').append("<p><a href='google.com'>Apply now</a></p>")
clearInterval(token)
}
}, 10, $('.modal-content'))
// set a limit on the interval in case of failure
setTimeout(clearInterval, 2000, token)
})

Wrap it in document ready, the element must be there when the code executes(assuming you already have the element with class .simple_form as hidden)
$(document).ready(function(){
$('.simple_form').append("<p><a href='google.com'>Apply now</a></p>");
});

leafletjs adding scrollable pop up?

Using leafletjs with popups. When I have popups with minimal text all works fine. If I make them bigger they still work fine. If I add too much I add
maxHeight
to the pop up and it makes the pop up scrollable.
If I start with out enough content to fill the page and make it scrollable, it is not made scrollable. That is Ok till I dynamically add more content to the popup and then I need the scroll bar but it will not show up.
Any thoughts on how to get leafletjs to add the scroll bar to a popup once the popup has already been rendered?
EDIT: The popup options are initialized with the markers in a loop that loads different arrays of data depending on what a person wants to see. The initialization is as follows.
var marker = L.marker(new L.LatLng(a[0], a[1]), { title: title });
marker.bindPopup('<img width="'+width+'" height="'+height+'" src="'+a[3]+'"/><br><div id="weather"> <button type="button" onclick="weatherload(\''+a[0]+'\',\''+a[1]+'\')">Click Me for Weather!</button></div>',{'maxWidth':'500','maxHeight':'350','minWidth':'350'});
CAMlayer.addLayer(marker);
The popup has an image that takes up most of the space. At the bottom there is a div with a button. When the button is clicked it is replaced with a loader gif while an ajax function gets some data that it puts in the popup by way of innerhtml.
document.getElementById("weather").innerHTML = xhttp.responseText;
I set the maxheigth to 350px, once the extra data is added it grows to 520px with no scroll bar.
EDIT: Removed test page.

How do you initialize your popup options and how to you add more content to it?
Once the maxHeight option is set, the scroll bar should appear as soon as the content is too big, and disappear as soon as it gets small enough.
Demo: http://jsfiddle.net/ve2huzxw/92/
EDIT:
Following the extra details and code about how you add content to the popup element:
The height CSS attribute (which makes the scroll bar appear if necessary) is dynamically added by Leaflet when it detects that the content is too big.
However, this detection occurs only if you use the setContent popup method. It is not triggered if you change the content through external function (like your AJAX callback in weatherload function that "manually" changes a part of the popup content innerHTML).
The easiest workaround is simply to call myPopup._updateLayout() internal Leaflet method on your popup, just after you have added content. This will "manually" force Leaflet to check the popup content height, and add the height CSS attribute if necessary.
Updated demo: http://jsfiddle.net/ve2huzxw/93/
A "proper" solution would be to avoid adding content through innerHTML. Instead, you should use setContent popup method to update your content (you would copy your initial image, and add your new content). This would also avoid using a div with an ID that is the same for all your popups (which relies on the fact that only 1 popup would be open on the map at any one time, but would break if this assumption is no longer true).

If your popup is smarter(is doing 'hard work') I recommend to compile a new directive on the fly.
var newScope = $scope.$new();
var myPopupContent = $compile('<div style="width:200px" gr-my-popup ></div>')(newScope);
L.popup()
.setLatLng(e.latlng)
.setContent(myPopupContent[0])
.openOn(map);
Where grMyPopup will be your directive.

Finding if `body` tag has class on Pop-up Window

I have a webpage where you can blow up the content into a pop up window using window.open.
The pop-up will have a class on its body called pop-up. Important to note, both windows use the same JavaScript file where it handles the click events.
I want to know if I am clicking in the pop-up or in the main (parent) window. Since the HTML is going to be basically the same.
Here is how I am attempting to do this. I maintain a global variable of the last clicked element and this seems to work:
$(document).click(function(event) {
window.lastElementClicked = event.target;
g_lastClicked = window.lastElementClicked;
});
I know this is good because when I check the tagName of the last clicked element it is always correct.
Then when I want to check "Where Am I" I wanted to do this:
var fromPopup = $(g_lastClicked).closest("body").hasClass("pop-up"); // the line in question
alert(fromPopup);
if (fromPopup) {
// unrelated; I need a check to do resizing if I am in the pop-up
var height = $(window).height();
$("#cvApplication").height(height - 120);
}
So it will check the last element, traverse up the DOM to the body and see if it has the class. I get false every time in the above alert. Is my logic wrong? Or is there a completely different way I need to be doing this?

They're separate windows, there's no need to track an "active" element. Each window has its own copy of the script and its own variables, event handlers, etc.
All you need in your code is
if ($(document.body).hasClass("pop-up")) { // Without the . before pop-up
// This code is running in the pop-up
} else {
// This code is running in the main window
}

I haven't checked the rest of your code, but you do not use a . when checking if an element has a class.
var fromPopup = $(g_lastClicked).closest("body").hasClass(".pop-up");
should be
var fromPopup = $(g_lastClicked).closest("body").hasClass("pop-up");

Dojo tabcontainer not displaying

Having some trouble getting dojo to display a borderContainer containing a tabContainer and a series of tabs, all contained within a dialog. This has all been done programmatically and the startup() event has been called.
The tabs are rendered and displayed, but rather unusually. Once the dialog itself is refreshed (discovered while opening and closing the console) everything rights itself. I've tried to force a resize() by calling it as part of start up - this hasn't worked. I've been trying to get this working properly for ages now. Its the only niggling thing about this! Having the manually refresh a dialog because a widget isn't displaying properly isn't exactly good UI design. The borderContainer does have height and width properties.
Could anyone suggest a few methods to try and why?
http://i.stack.imgur.com/YXtkq.png
Screen shot above (sorry I don't have 10 rep yet)!
I've tried to use 'doLayout: false' and that hasn't worked. I've got the 'style' set to height: 360px and width: 575px which are both well within the boundaries of the containing widget.

Well I discovered that simply doing startup() on the parent widget was not enough. Because it was instantiated in a hidden dialog widget, it needed to be instantiated from there.
the onclick event for the button was:
//custom widget - contrary to its name, this is the content!
var invoiceDialogWidget = new InvoiceDialogWidget(dialogValues);
var dia = new DijitDialog({
id: "invoiceDialogWidget",
content: invoiceDialogWidget,
title: "Invoice Detail"
onHide: function(){
this.destroyRecursive();
}
});
dia.show();
//magic line
invoiceDialogWidget.invoiceDialogContentNode.startup();
What I found was that by calling startup() as I had in the snippet above - the custom widget was instantiated correctly and matched the style of the dialog (which was made visible). Before I was calling it from within the custom widget, which hadn't been fully instantiated yet!
The result was calling startup() on a widget which defaulted to its parents style - which was invisible at the time.