Im trying to implement a filter on the jQuery-masonry.
But the problem is if i hide a middle element, others dont rearrange.
This leaves lots of gutters in between.
Tried the .masonry('reload');
Caan anyone please help.
There is an open issue. Workaround: use :visible on your selector.
$('#container').masonry({
itemSelector: '.mybrick:visible'
});
Related
I'm trying to render my list of data using the WindowScroller and List from react-virtualized, but for some reason, only a portion of my data is rendering. I've read over the docs and I believe I have all the necessary props...help is appreciated!
Taking my List out of the WindowScroller renders everything correctly, but I'd like to keep the WindowScroller to give scrolling controls to the parent element.
There are 100 items in my data set, but only a portion of them are rendering.
Here is a sandbox with an example: https://codesandbox.io/s/jolly-gagarin-vczki1?file=/src/App.js
UPDATE #1:
I believe I've found the cause of my error! It seems that the height in the List element is the issue; it's not large enough thus cutting off my data. Because my List has no fixed height to begin with (height depends entirely on the number of children), I think I need a way to dynamically calculate the height of the List. I did find a method for List elements called measureAllRows, but I can't get it to work :( (see my sandbox above)
UPDATE #2:
I found a really hacky way to do it; by setting the List element's height prop to Infinity, I can get all of my items to render. This doesn't feel like a good way to solve the problem, but it does fix my issue with a dynamic list height.
UPDATE #3:
The answer below helped when just using AutoSizer, but I was curious... if I were to put my AutoSizer into a WindowScroller like so: https://codesandbox.io/s/ecstatic-sunset-g4k3ly?file=/src/App.js, how could I achieve a similar fix for displaying all of my data?
I can say that the problem lies in one of the parent div for WindowScroller component which is causing this behaviour.
The overflow property cannot be set to auto for WindowScroller to work. If you try executing only the windowScroller part without modal window it works as expected.
https://codesandbox.io/s/elastic-ritchie-k938m0?file=/src/App.js
I was also stuck with similar problem and this worked for me, in your code try removing the autoheight parameter and get the height from the autosizer.
Reference:
https://codesandbox.io/s/recursing-pine-2w2m8f?file=/src/App.js
I am quite new to puppeteer and am stuck with trying to click on an element. In the image, that is the "i" element, I want to click on.
When I try to click it, I get the error "Node is either not visible or not an HTMLElement". I guess it is not visible, because there it the nb space in front of it.
Is there a way still to click on it? When I manually click on it, it works, so I would think that puppeteer would also be able to do it?
Thanks,
Benni
After quite some testing I found a way how to click it. First, this didnt work:
page.click(selector)
This brought up the error that specified before.
What worked now was that:
page.evaluate(function (selector) {
const elements = document.querySelectorAll(selector);
elements.forEach((element) => {
element.click();
});
}, selector);
Not sure why the element is coming up multiple times. It should be there only once.
I am not an expert with puppeteer, but happy that this worked. Maybe it helps someone else.
I have a question about paginationElement in Tabulator.
As per tabulator documentation, i created a DIV and used paginationElement in Table setup to render the paginator in the DIV. Well, it works. But with a drawback, no styling works, no colors, no highlighting of current page. So it is kinda inconvenient.
Is there a way to resolve this?
Otherwise, i am really happy with Tabulator! Thank you for the great work!
Cheers
You might have to style the pagination footer by css as the location of it has been changed by paginationElement.
This is because all of the table styling is based around the pagination element being inside the table.
Moving it outside the table will mean you will need to apply the styles yourself. The classes that denote that you are on the current page etc will still be applied, you just need to tell the browser how to style them.
The Styling Documentation contains more information on the classes used by tabulator and how to style the table
I have been trying to automate my work and we use service-now for our requests. However, for the the life of me I can not get Selenium to run properly on the service-now website. It works on the login page before entering, but no matter what form of locater or x path I use it will not work. The website is dynamic so I am pretty sure xpath is needed.
I have tried directly from Google Chrome inspect as well as other xpath possibilities:
//*[#id="row_sc_request.sc_task.request_65091fb5db8163c4bc8f18df4b961921"]/td[3]/a
xpath=//a[starts-with(text(),'Open record: SCTA')]
xpath=//a[class="linked formlink" and starts-with(#aria-label='Open record: SCTA')]
This is the element copied from chrome
<a class="linked formlink" aria-label="Open record: SCTASK0067185" href="sc\\\_task.do?sys\\\_id=65091fb5db8163c4bc8f18df4b961921\\\&sysparm\\\_record\\\_target=sc\\\_task\\\&sysparm\\\_record\\\_row=1\\\&sysparm\\\_record\\\_rows=1\\\&sysparm\\\_record\\\_list=request%3D9509dbb5db8163c4bc8f18df4b96199f%5EORDERBYDESCnumber">SCTASK0067185</a>
Can someone please review my code? Any help would be appreciated!
I will suggest going with absolute XPath, I guess below note can help
Note:- if you copy XPath from Firefox it will mostly give you absolute XPath whereas chrome on another side will give relative
or the other way is to make an XPath using another stable element in the DOM tree
I hope this workout for yours. if you can share a link or inspect element snapshot showing Full DOM I can help you even better. Thanks :-)
There is a syntax error in the second xpath, this one - xpath=//a[class="linked formlink" and starts-with(aria-label='SCTA')].
In xpath the attributes must be prefixed with the "#" char; and starts-with() takes two arguments, not a boolean. So it must be:
xpath=//a[#class="linked formlink" and starts-with(#aria-label, "SCTA" )]
I don't know for sure will that make it match (it should, based on the sample), but will get you closer.
Thank you for all your answers. It turns out all I needed to do was switch the IFrame.
I am fairly new to this so I had no idea.
In my situatuion, I had to write:
"browser.switch_to.frame(browser.find_element_by_name('gsft_main'))"
where gsft_main is the name of the frame.
After doing this, then I was able to use:
browser.find_element_by_xpath("//a[#class='linked formlink' and starts-with(#aria-label, 'Open record: SCTA' )]")
and it worked out.
A solution might be to switch from an absolute xpath (the one that you find in the browser's developer tools: Copy->Copy XPath) to a relative one. For that you can install an extension like SelectorsHub and look for 'Rel XPath'
In one particular example I discovered that the absolute xpath simply did not work.
I'm writing a VBA code to login into a webpage and load some information i have in an excel worksheet.
I'm new in Selenium. I already got the login part right, but now i need to click in an element and i keep getting errors.
I need to click in the Company 2 button.
This is what i've got so far:
bot.FindElementByXPath("//input[#value=""Company 1""]").Click
Outputs NoSuchElementError
bot.FindElementByXPath("//input[#value=""Company 2""]").Click
Outputs ElementNotVisible
I don't know what i'm doing wrong, i think that the first input being hidden has something to do. Hope anyone can help me.
Might help you to know you can also use ByCss in most circumstances, in which case you can use:
bot.FindElementByCss("input[value='Company 1']").Click
That is nice and short.
The CSS selector is input[value='Company 1']. This says find element with input tag having attribute value with value of 'Company 1'.
XPath might be incorrect. Please try the following syntax:
FindElementByXPath("//input[#value='Company 1']")
First of all, use CSS selectors whenever possible. They are much easier to handle.
Now if you are using CSS selectors try to find the second button using something like
input[value="Company 2"]
For more info on this selector, look at https://www.w3schools.com/cssref/sel_attribute_value.asp
You can use any xpath, in first look I found your xpath is incorrect, try this:
//input[#type='button'][#value='Company 2']
//input[#type='button'&& #value='Company 2']
//input[#role='button'][#value='Company 2']
You can also use findelements() to store are all buttons and using if else you can extract the company 2 button
As per the HTML you have shared to invoke click() on the desired elements you can use the following solution:
To click on the element with text as Company 1:
bot.FindElementByXPath("//input[#class='btn_empresa ui-button ui-widget ui-state-default ui-corner-all' and #value='Company 1']").Click
To click on the element with text as Company 2:
bot.FindElementByXPath("//input[#class='btn_empresa ui-button ui-widget ui-state-default ui-corner-all' and #value='Company 2']").Click
Have you tried right-clicking the HTML in inspect and going to Copy>Copy XPath? That might give you something different. Maybe the buttons are created from Javascript and so the WebDriver can't actually see them?
Or try
Company_1 = bot.find_element_by_xpath("//input[#value='Company 1']")
Company_1.click()
Company_2 = bot.find_element_by_xpath("//input[#value='Company 2']")
Company_2.click()
And change the syntax with the ' ' quotes like someone else mentioned.