Capybara Ambiguity Failure select list - html

I am getting
Ambiguous match, found 2 elements matching css ".active-result" with text "jeeny"
<select style="display: none;" class="form-control input-sm" id="column" name="column"><option value="">Select</option><option value="UPPER(supervisor.name)">jeeny roat</option>
<option value="UPPER(suprem.code)">jenny</option>
<option value="UPPER(officer.code)">carl</option></select>
it is able to detect jeeny roat bu not jenny
chosen_select('jeeny', from: 'column')
chosen_select('jeeny roat', from: 'column')
Also not able to detect value select select list is hidden
chosen_select is a helper method
Chosen::Rspec::FeatureHelpers using instance method
def chosen_select(value, *args)
opt = args.extract_options!
input = chosen_input(opt)
args.unshift(value).uniq.each { |item| chosen_select!(input, item) }
end

I did some searching, and am going to guess that you're using the chosen-rails gem which provides the chosen_select method defined at https://github.com/tsechingho/chosen-rails/blob/fb28dfcf0dca5ef49344a8d961b733b5bd96449f/lib/chosen-rails/rspec.rb This ends up calling chosen_select! which should work due to the specifying of :prefer_exact for the matching method at https://github.com/tsechingho/chosen-rails/blob/fb28dfcf0dca5ef49344a8d961b733b5bd96449f/lib/chosen-rails/rspec.rb#L66 . Since it's not working for you and the fact that you're still on Capybara 2.1.0 I'll guess you're also on a really old version of chosen-rails from before the matching method was specified. If that is the case, and you can't upgrade the gem, you can try specifying a Regexp to force the text find into exact mode
chosen_select(/\Ajeeny\z/, from: 'column'

Related

Semantic Mediawiki and properties in template

I have the following construction in the template to check whether attributes are full
{{#if:{{{typeip|}}}|'''Type IP:'''{{{typeip}}}|<big>'''Type IP:'''</big><span style="color: red">not filled in</span>}}
I want the typyap attribute to be a property so that I can find it by semantic search or by using a query via the #ask function.
I tried the following construction
{{#if:[[typeip::{{{typeip|}}}]]|'''Type IP:'''{{{typeip}}}|<big>'''Type IP:'''</big><span style="color: red">not filled in</span>}}
But it doesn't work. The #asc function returns an empty request and the type ip property page is empty. Can you tell me what I'm doing wrong? I performed reindexing using a service script rebuildData.php But that doesn't help either. I tried to insert the property in various other places in the template, but it doesn't work either. The template is filled in using the form.
Thank you in advance!
Of course, it doesn't work. You invoke the {{#if:}} parser function incorrectly.
Its parametres are:
the condition,
the value returned if the first parametre does not evaluate to an empty string or whitespace,
the value returned if the first parametre is empty.
Therefore the semantic annotation should be in the second parametre, not the first:
{{#if:{{{typeip|}}}
| '''Type IP:''' [[typeip::{{{typeip}}}]]
| <big>'''Type IP:'''</big><span style="color: red">not filled in</span>
}}
{{{typeip}}} should be bare text without any wiki formatting. If you must pass wikitext to it to convert wikilinks into semantic annotations setting properties of the type Page, the simplest way will be as follows:
Install Scribunto,
create Module:Inject with the following content:
return {
property = function (frame)
local wikitext, property = frame.args[1], frame.args[2]
local annotation = mw.ustring.gsub (
wikitext,
'%[%[([^|%]]+)(|[^%]]*)?%]%]',
'[[' .. property .. '::%1%2]]'
)
return annotation
end
}
put the following in your template:
{{#invoke:Inject|property|{{{typeip|}}}|typeip}}
The template will convert any wikilinks in {{{typeip}}} like [[A]] or [[B|C]] into semantic annotations like [[typeip::A]] or [[typeip::B|C]].

saving part of JSON in a function invoked in the html file

I'm developing in Angular.
I'm trying to save part of a JSON in a variable inside a function called in an HTML file:
<select id="postazione" onchange="postazioneSelezionata()">
<option value="" selected disabled >Scegli una postazione</option>
<option *ngFor="let postazione of postazioniNome" value="{{postazione}}">{{postazione}}</option>
</select>
(the onchange="postazioneSelezionata()").
it seems works, because if I try to print the value I'm interested in inside the console.log, it is shown correctly.
postazioneSelezionata(){
this.postazione = document.getElementById("postazione").value;
console.log(this.postazione);
}
inside the function i'm also trying to show this in the terminal:
console.log(this.fileJson.ricette[this.postazione]);
Here comes the problem...
If i try to show the part of the JSON this.fileJson inside the console.log(), it return me an error:
ERROR TypeError: Cannot read property 'ricette' of undefined
at HTMLSelectElement.postazioneSelezionata [as __zone_symbol__ON_PROPERTYchange] .
i've tried to show it in another function (not called from an html onchange event)
this.postazione = "GRIGLIA";
console.log(this.fileJson.ricette[this.postazione])
and it works... this code (called in another function) show me the portion of the fileJson JSON i'm trying to obtain
Possibly this post will be of help.
Additionally, even though you say your onchange works, the standard syntax for such events with Angular, as m.akbari mentioned in his comment, is (change):
<select id="postazione" (change)="postazioneSelezionata()">
...
</select>
And from there, unless you're not particularly bothered about the value of the change and just care to know that something was changed, you would probably pass the value in that changed...
<select id="postazione" onchange="postazioneSelezionata($event.target.value)">
...
</select>
Similar changes, syntax-wise, in your options for entering your value:
<option *ngFor="let postazione of postazioniNome" [value]="postazione">{{postazione}}</option>
Input/output binding, two-way binding, event binding... all are fairly integral to Angular, it's worth getting them figured out.
Again, see the post linked at the top for a more rounded answer and examples to using selects with Angular.

Selenium WebDriver unable to find element that is clearly there

Ok, this statement is giving me an error:
new Select(driver.findElement(By.id("870"))).selectByVisibleText(reason);
org.openqa.selenium.NoSuchElementException: Unable to locate element: {"method":"id","selector":"870"}
Command duration or timeout: 1.02 seconds
And I have tried finding it by xpath, and id, and I know for a fact its there with the id 870. I have tried putting in sleeps to make sure it is loaded too.
Thanks in advance.
I am using version 2.5 with Firefox.
Element is
<select id="870" class="ui-widget-content reactor alias_reason" data-bind="options: questionValueGroup.questionValues, optionsText: 'qu…: properties(), setSingleSelected: $parent.providerAnswers()" paid="37" group="6" style="background-color: #FCFDFD;"></select>
edit 2: I figured it out guys, I just used chromes xpath selector tool and it gave me a different xpath that works.
I am thinking that the fact you have an id which starts with a number is confusing Selenium. W3C standards say that Ids cannot start with numbers, therefore try the following;
new Select(driver.findElement(By.css("[id='870']"))).selectByVisibleText(reason);
or
new Select(driver.findElement(By.xpath("//*[#id='870']"))).selectByVisibleText(reason);

data-bind: value - parenthesis - observable

I started working with knockout a few months ago and so far it is being a very good road. Today when I was working with some inputs in my html I came across a very boring issue that took me a while to figure out. Here is my code:
<div class="add-box" style="display:none;" id="new-user">
<textarea placeholder="Name" data-bind="value : name"></textarea>
</div>
<script>
function UserViewModel() {
var self = this;
self.name= ko.observable('');
}
$(document).ready(function () {
ko.applyBindings(new UserViewModel(), document.getElementById('new-user'));
})
</script>
This code works fine, but the first time that I did was like this:
<textarea placeholder="Name" data-bind="value : name()"></textarea>
The only difference between them are the parenthesis () at the end of the name property. Since this is a observable one I thought that the parenthesis would be necessary in order to make the 2-way-binding. But with them, whenever I change the value of the textarea the viewmodel is not update accordingly, if I remove everything works.
Could you explain why on this case I have to remove the parenthesis, and why in other scenarios, like when I used data-bind="text: I have to put them??
Here is the magic with KO: special "Observable" function-objects.
When you use parenthesis, you evaluate the observable (which is just a special function) which results in a value that breaks "live" data-binding: in this case the underlying value (say, a string) is bound, but not the observable from which the value was obtained.
The underylying bindings are (usually) smart enough to deal with both observables and non-observable values. However, bindings can only update observables and can only detect Model changes through observables.
So, usually, do not include parenthesis when using obervables with declarative data-binding.
Passing the observable will make sure the Magic Just Works and allow the View and Model to stay in sync. Changes to said bound observable will trigger the appropriate binding update (e.g. so that it can update the HTML) even if the binding does not itself need to update the observable/Model.
However, in some rarer cases, you just want the value right then and you never want the binding to update from/to the Model. In these rarer cases, using parenthesis - to force value extraction and not bind the observable itself - is correct.
In my case I was using jquery.tmpl ,
and knockout 2.2.0 works with jquery.tmpl, when I upgrade to knockout 3.0, I got this problem
when I use this one, It somehow get conflict with Knockoutjs builtin template/
Removing jquery.tmpl.js resolves my problem.

Lock HTML select element, allow value to be sent on submit

I have a select box (for a customer field) on a complex order form, when the user starts to add lines to the order they should not be allowed to change the customer select box (unless all lines are deleted).
My immediate thought was that I could use the disabled attribute, but when the box is disabled the selected value is no longer passed to the target.
When the problem arose a while ago one of the other developers worked around this by looping through all the options and disabling all but the selected option, and sure enough the value was passed to the target and we've been using since. But now I'm looking for a proper solution, I don't want to loop through all the options because are data is expanding and it's starting to introduce performance issues.
I'd prefer not to enable this / all the elements when the submit button is hit.
How can I lock the input, whilst maintaining the selected option and passing that value to the target script? I would prefer a non-JavaScript solution if possible, but if needed we are running jQuery 1.4.2 so that could be used.
Edit
I've tried to use the readonly attribute with little success, here's the jQuery code I'm using:
$('.abc').each(function(element) {
$(this).attr('readonly','readonly');
});
When inspecting the element with Firebug the readonly attribute had been set, but I can still change the value in the select box?!
This works:
$('.abc :not(:selected)').attr('disabled','disabled');
jQuery will still be looping through the elements behind the scenes, but I seriously doubt you will have performance issues unless your select has thousands of elements (in which case your usability issues will far out weigh the performance issues). The original code must have been doing something wrong.
This works fine
<select disabled="true">
<option value="1">one</option>
<option value="2">two</option>
<option value="3">thre</option>
</select>
Add a hidden field to your form and onsubmit take the value from the select and place it in the hidden field's value
As per the HTML spec, readonly is not supported by the select tag
The element does not accept readonly attribute. Readonly is a wrapper that fix this.
Try this:
https://github.com/haggen/readonly
"select" does not have a readonly attribute. It has only disabled attribute.
http://www.w3schools.com/TAGS/att_select_disabled.asp
So your best best is:
$('.abc').each(function(element) {
$(this).attr('disabled','disabled');
});
HTH
I'd have an idea, that was functional to me:
In my case, when a user selects an option (an account) in a drop-down on a form of an accounting system, e.g., some kind of "expense", that I know that may not be "credited", just "debited", another drop-down that selects the accounting operation (Debit/Credit), changes these drop-down to "Debit".
Then, I "lock" (using "disabled=true") these last "drop-down" in the "debit" option.
The problem that occurred to me these moment, was similar of yours: after disabling the drop-down element, I couldn't receive it in the target, anymore.
So, what I've done:
1 - Changed the option in the second drop-down list, as I said:
document.getElementById("operation").value = "D";
`
2 - Disabled that dropdown:
document.getElementById("operation").disabled = true;
Then, the "cat salt":
3a- Added to the "FORM" element, an "onsubmit"
onsubmit = "validForm()"
3b - On my [java-script] file I added the ["valid-Form"] function:
function validForm()
{
document.getElementById("operation").disabled = false;
}
Voilá!
A simple way to disable any Select is to just disable mouse interaction.
For example:
<select id="complaint_status" name="complaint_status" class="disabledSelect" value="Pending">
<option value="Pending" selected>Pending</option>
<option value="Complete">Complete</option></select>
css
.disabledbutton {
pointer-events: none;
opacity: 0.4;}
The value of Select will be SUBMITted.
Hope it works!!