Changing a subarray in document will not rerender with proper order - jquery-ui

I am using jQuery UI sortable to update the order of an array stored in a container document. When the sort fires the "stop" method, it rebuilds the array and orders it based on the new DOM layout. It all works fine and the updated document reflects the proper order. HOWEVER, the dom reloads and the order is back to what it was.
When I physically refresh the page it actually shows the proper order. It's just that on-the-fly changing of the array won't just re-render itself properly.
Interestingly enough, this problem has only cropped up in 0.9.4, so it may be a bug with meteor, just not sure if there was a change that would affect what I'm trying to accomplish.
I'd provide code examples if needed, but since the code itself seems to be working properly and the each not updating to reflect the order, i'm not sure it'll help at all.
Thanks!
UPDATE
I've put together a standalone demo of the problem, listed out in my comment below:
Ok, here's a crazy example of the issue:
demo: app-9ryym2m2.meteorpad.com
source: meteorpad.com/pad/uQ42DRH95JcHtKnb9
Try doing some sorting of items to see part1 of the issue. Next, after sorting, try hitting the togglers a few times, especially within the list of items you sorted. That's part2 of the issue. Now, if you refresh the page, everything gets caught up. Wat.
Double Update
Thanks to aldeed over at Github, I've got a solution: https://github.com/meteor/meteor/issues/2944
By changing my sub-document reference key from 'id' to '_id', Blaze seems to pick up on the changes to sorting no problem!

I confess that I haven't dug into your code, but the way it is updating indicates that you are picking up the previous state rather than the updated state. Wherever you drag, the final state reflects the last place you dragged to (even though it was probably in the wrong place when you started). Perhaps an order-of-execution/async bug?
Have you seen the drag and drop demo that was put together for blaze by Avital Oliver (Meteor core dev) when the blaze rendering engine came out? You can watch a video and check out the repo. If you try the demo and it fails on the current version of Meteor, you can submit an issue there and get some support from the pros :)

Related

UI5 UploadCollection Issue

I have an UploadCollection in my XML view bound to a JSONModel. When I add / delete files in the collection all works good initially. When I save the required data to the database and then refresh the JSONModel from the database I get the attached error. It is as if the elements are not being removed from the DOM, however, when I look at the entire process via the Chrome debgugger the elements are indeed gone in between. I am currently using OpenUI5 v1.78.1 but the same issue occurs with the latest (v1.86.3). The UploadCollection fails to work again from then on and I need to destroy it in my view before the data will be displayed again.
Has anyone seen this or have advice on how it may be corrected?
I figured it out. It appears that when I was calling UploadCollection.removeItem(item); it did not unregister the element somewhere and held onto the idea that the HTML elements still existed. Using item.destroy(); instead solved the issue.

when removing element from form array with react-final-form, the displayed value of the <input> does not update, but final-form data object does

This is a bizarre situation. I have simplified an example of react-final-form-array that allows me to add elements to my form, and i can extend an array of objects. It is very similar to the simple example provided by react-final-form-arrays. The array works just fine, but the issue im having is that when i try to REMOVE a specific element, the actual value displayed in the inputs doesnt change. So for example, with images:
Here we can see i can add customers to a list, which makes an array of objects. This works great. Now, let's say i want to get rid of the first element. i click the X, and what happens?
Here we can see that the form data properly removed the first element i wanted to remove, however, the actual value DISPLAYED on the inputs is still John Doe, though the form knows it's Mary Jane. When i click on the inputs, they seem to update to the correct values. But this is not what should be happening.
The STRANGEST thing though, is that i made a codesandbox you can see here https://codesandbox.io/s/agitated-wilson-5xlqq
It has the exact same code I have on my app, and it works as expected! So i cant even recreate the bug and i made sure the dependencies are the same versions im working with. I can only recreate it in my own setup, and i dont understand why that is.
I tried with chrome, safari and firefox and they all seem to be doing the same thing on my computer and i even tried on my phone by connecting to my react server that runs on my laptop, and they all show the same behavior.
I dont know what i could be, versions, react, if anyone has any idea or has had a similar issue in the past, PLEASE HELP. I won't paste my code here so as not to bloat this post, but you can see it's literally the exact same code in the sandbox i linked above.
EDIT: I want to point out another bug that occurs, and thats once i remove the first element, if i try to edit it, it pushes another field into the array with the input i just added, as if it were bound or something. I wish i could recreate it on codesandbox
Try deleting your node_modules folder and reinstalling them. Are you seeing any errors in your console log?

Filter not working on Tablesorter 2.17.8 > probably my bad

Been working on getting the UITheme Widget (Bootstrap v3.x) version going to behave exactly the same as this. https://mottie.github.io/tablesorter/docs/example-widget-bootstrap-theme.html.
Paging & sorting are working fine. When I click on a search box in the 2nd row to type something, for some strange reason, the sort feature fires & as I type nothing happens.
Ive checked over the head code to compare with the documentation & they are the same. When I inspect with Chrome, I can see an additional class of table sorter-header-inner yet this is not in the code of the 2nd row (search row)
An example page with my code can be found here
It could very well be that I have not added a css file or something. Ive searched the files that come with the download above & can't seem to find any additional files related to a filter widget.
Would really appreciate some assistance getting this nailed.
Thanks in advance.
Todd
Thanks #Mottie, Little bit embarrassing & a trap for new players but I found myself inspecting elements & copying that code directly into the header. not following your documentation to the letter & simply having say English and letting all the magic happen behind the scenes... I'm probably not the first person to have tried this but hope other newbies benefit from me sharing

JSF 2 f:subview not seeing my changes reflected in the UI

Update It appears I have to rebuild/redeploy the app to see the changes. Anyone know why I have to do this? It's a static .xhtml page. Coming back to update, looks like I just have to stop/restart the server, not a rebuild. I was dumb and didn't try that first, mostly because I have to rebuild/deploy often anyways.
I'm working on a JSF 2 app that uses f:subviews. I'm on one subview where my changes aren't reflected in the UI when I refresh the browser. I've worked on other subviews where I don't have this problem.
I have a batch script which copies my .xhtml files into my installed apps folder. The batch script reports the file is copied over. It's business as usual... If I drill down into this particular installed app, I see my change in the file. Again, seems like business as usual. The change is not reflected in the UI when I refresh, however.
These are simple text changes I'm making, but not seeing.
The problematic subview doesn't appear to be anything special, it's just a p:datatable that's included via a ui:include with a couple of parameters for the data and to give it a unique id. If I replace the p:datatable with just simple text, the "old" table still shows up in the UI when I refresh. I just can't get any changes in this subview to be reflected in the UI.
Console doesn't throw any errors.
I'm using WebSphere 7.0.
Never encountered this problem before. It isn't a browser caching issue as I can edit other subviews and see those changes when I refresh the page.
Anyone have any ideas?

Selenium Web Driver Error

I'm getting a weird error while trying to click on a Capybara Element
I'm using find(:xpath,"//a[contains(text(),'Connect')]").click
(find(:xpath,"//a[contains(text(),'Connect')]").present? return true)
the error I get is:
Selenium::WebDriver::Error::MoveTargetOutOfBoundsError Exception: Element cannot be scrolled into view:javascript:void(0);
i did some research and the only solution i found is that setting the selenium version to 2.16 may fix this issue (i'm using 2.25).
anybody got an idea?
It may happen when the page being tested is not fit into the current window size. If you know such pages where usually these error happening, you may explicitly scroll down before doing the operation on such hidden elements(like click, clear etc). Here the code to explicitly scroll down the page.
In java,
JavascriptExecutor js = (JavascriptExecutor) driver;
js.executeScript("javascript:window.scrollBy(250,350)");
From the times I used selenium webdriver to test .NET apps, I would get that error when the issue was exactly what it sounds like: It's looking for an object on the page that it cant scroll to for some reason. In my case it was because some dialogue boxes would appear without scrollbars and the driver had no way to "scroll the object into view"
Can you watch the execution of your test and see if that's the case? I had some luck rolling back to a previous version of firefox because 15+ was (as of about 2 months ago when I had the issue) unsupported by web driver and had this problem periodically. Rolling back selenium versions may help too.
First step though is definitely to watch the execution of the test and see whats happening though. And a good debugging idea may be to try to work through your steps manually yourself to make sure the test works by hand.
Its also worth noting that for the webdriver to be able to execute click the object actually has to be visible. IsPresent doesnt require that, it just searches the page files. Also an issue I ran into. IsPresent will still return true for objects that are not and cannot be made visible on the page (i.e. something at the bottom of the page that you cant see at the time)
Couple of tips here:
Webdriver should ideally be on the most recent update, it's what most use (Unless you're doing Ruby Automation)
Use css selectors, xpath (Whilst rendered), is almost always heavier on both resources and code.
Try defensive coding, first of all ascertain it exists. There are many ways to do that dependent on what package you are using. In ruby you would do page.has_css?('css_string')

Resources