I built an Angular Reactive Form using Ionic 2.
When I was touching an input at the bottom of the page the page would scroll so the input get above the keyboard. Expected behavior, so ok. But the header was push too and that was wrong.
So I looked on the internet and find a workaround which was to write the following in the import statement of app.module.ts
// app.module
IonicModule.forRoot(MyApp, {
scrollAssist: true,
autoFocusAssist: true
})
That indeed works well as the page still scrolls and the header is not push away.
But I still have one problème. When I touch an input which doesn't need the keyboard to be shown (eg. datepicker) the page scroll on the first touch and I have to touch again so the datepicker opens...
Any idea on how I could may be prevent the page to auto-scroll when touching an input that doesn't need the keyboard?
This could be possibly achieved by using two properties of input component. Firstly you can set the readonly property to true and then add the click Eventlistner to open the DatePicker and then use the placeholder property of input to show the value of DatePicker.
I hope this would help you find the solution. Let me know if this works.
Good Luck & Cheers
Ashish Sebastian
Related
My page is: https://www.svelysium.net/ And one can see the menu as a list flash first then display correctly. I'm testing visibility:none in the CSS for the div and then wanting to do an onload later for the visibility after the page loads so I don't get that menu flash. I've not put it up live because I can't seem to get it right. Sorry I can't find any examples of this issue and how to solve it and I have been trying to keep it simple. There must be an easy fix. Thanks in advance.
I am looking for how you can build a link in draw io, so that when you click first, it hides a layer and then opens a different page of the same draw io document.
so far i tried this:
data:action/json,{"actions":[{"toggle": {"cells": ["SvuciECQg7tZUCU10AH1-3"]}},{"open": "data:page/id,IZEQzf0yfGXm-2QJ5-Q8"}]}
But it seems that the Toggle is executed after the Open, and I need the Toggle to be first and then the Open.
I even tried to do an Open of the same page I'm on, do the Toggle, and then do the Open of page 2, but it didn't work. I would appreciate if anyone knows how to do this, thank you very much.
This is pretty old, you've probably figured it out or given up by now. In case you haven't:
If you want to Hide a layer, just Hide the layer. This did exactly what you're describing: (I've inserted your IDs)
data:action/json,{"actions":[{"hide":{"cells":["SvuciECQg7tZUCU10AH1-3"]}},{"open":"data:page/id,IZEQzf0yfGXm-2QJ5-Q8"}]}
If you need to toggle the layer back on, you'll need to Show it again. The code you have works, it's kindof unexpected not knowing if the layer is showing or hidden at the start.
Unless the layer you want to show/hide is on the different page.
You won't be able to interact with objects on a page that's not in scope. In that case, you probably want to hide the layer by default. That way, when you Open the second page, the layer is already hidden.
I'd like to automate a video-player on a webpage using Selenium in Python.
I cannot locate the interactive parts of the player with driver.find_element_by_... I've decided to try and accomplish this by making browser specific logic that knows how to navigate the page and player via keyboard navigation (count tabs for Chrome, vs Safari, vs Firefox, etc.).
driver.find_element_by_tag_name('body').send_keys(Keys.TAB))
I am able to select each of the controls of the player with tab (play/pause, current position, mute-volume control, full-screen, and additional options) and have had moderate success manipulating the player's controls with ActionChains once selected with TAB navigation
actions = ActionChains(driver)
actions.send_keys(Keys.DOWN) # to reduce volume or
actions.send_keys(Keys.LEFT) # to rewind playback
An example of something that doesn't work as expected with this method is sending a Key.SPACE to the MUTE button when selected. Instead the space is applied as a page navigation action and scrolls down the page like pressing page down. I'm looking for a method that either makes the controls work as expected when manually navigating the page with a keyboard, ex. space on highlighted object interacts and would normally mute the video in this context, or a workaround that lets me accomplish the same thing. To that end I was thinking if I could get the windows coordinates of the TAB selected object within the video-player and simply perform a click that would at least let me interact with the control.
Also if I'm going about this all the wrong way let me know. Thanks!
What you're really looking for is how to navigate the Shadow DOM. Those are the web elements inside the video player.
I answered how to reach inside the Shadow DOM in an other question, albeit for Java. However the principle is the same.
You can read the whole thing at the link, but the basics are you create a "starting point" WebElement at the Shadow DOM via JavaScript, then all future look-ups reference it:
WebElement button = startingPoint.findElement(By.cssSelector("..."));
I want to be able to search right after the webpage is rendered, instead of click on the search box then start typing.
However when I trying to mimic focusInput in original source code, it doesn't work.
It could be reproduced by visit
https://ember-power-select.com/docs/multiple-selection
and run document.querySelector('.ember-power-select-trigger-multiple-input').focus() which is focus on an input tag.
I expected to see something like this
, but actually nothing happened.
I also tried to .click() on all parent html elements of that input, but nothing happened
Any help?
I would suggest a tabindex to you. When you set the tabindex to 1 the search field will be the first to focus.
As an alternative you can try to achive this with an application instance initializer. In it you can now select the proper element and set the focus on it.
I have a form that contains a select box and a text field.
The text field is displayed dynamically based on the selectbox selection. If the value of selectbox is "Yes", then the text field will be displayed and vice versa.
I am running an rspec test and filled the select box value with "Yes"
select 'Yes', from: 'property[have_water_bills]'
Now i want to fill a value on the text field
fill_in 'property[irrigation_cycle_count]', with: 5
But i am getting the following error.
Capybara::ElementNotFound:
Unable to find field "property[irrigation_cycle_count]"
That is, capybara cannot find the dynamic element. Does anyone know how to fix this?
Poltergeist doesn't gemerate a click event when choosing an item from a select. It generates a focus on the option, change on the select, blur on the option. It is more like if a user selected the option with keyboard instead of using a mouse. You probably should be doing the logic to display your text field on the change event anyway so that it works if people use a mouse or a keyboard to navigate around your page. It also makes more sense to run your show/hide logic on the change event because that's what you actually care about, not clicks.
Finally got this to work using the following piece of code
page.execute_script("$('#have_water_bills').val('true').trigger('click')")