md-autocomplete md-require-match on lose focus - angularjs

I have an autocomplete control (Angular Material version 1.1.2) with md-require-match=true and a validation message
<md-autocomplete required
md-no-cache="true"
md-select-on-match = "true"
md-selected-item="vm.selectedItem"
md-search-text="vm.searchText"
md-items="country in vm.querySearch(vm.searchText)"
md-item-text="country.nm"
md-min-length="2"
md-selected-item-change="vm.updateOrgCountry(country.cd)"
md-require-match = "true"
md-input-name="countryField"
md-match-case-insensitive = "true"
md-floating-label="Country">
<md-item-template>
<span md-highlight-text="vm.searchText" md-highlight-flags="^i">{{country.nm}}</span>
</md-item-template>
<md-not-found>
No Countries matching "{{vm.searchText}}" were found.
</md-not-found>
<div ng-messages="orgForm.countryField.$error">
<div ng-message="required"></div>
<div ng-message="md-require-match">Country not found.</div>
</div>
</md-autocomplete>
When I first enter the control and start typing everything works as expected. If I don't select an item from the list and then move away from the control I get the "Country not found" error message.
However if I go back to the control and start typing again I get the "Country not found" error message after every key press until I select something from the list. I don't want this behaviour as the user should be seeing an error while still entering data.
Is there a way to configure the autocomplete control to only validate for a match as the control loses focus?

Related

Cannot get a valid selector to implement I.click()

I am trying to click a button that has these details when I F12
<a data-codecept="searchGo" id="9" class="a-button a-button--white clearfix block showall" suggestrow"="" alt="/s/lundhags/?searchparam=lundhags" onmouseover="suggest.handleMouseOver(9);" onmouseout="suggest.handleMouseOut(9)" onclick="suggest.handleSubmit();" xpath="1">Show all results for 'lundhags'<span class="a-icon a-button__icon a-button__icon--double-arrow"></span></a>
I have copied xpath and I had a code like this=>
I.click('//*[#id="9"]');
and I got this error
Clickable //*[#id="9"] was not found by text|CSS|XPath
What am I doing wrong?
It works now! I used the specific Identifier
I.click('[data-codecept="searchGo"]');

Unable to get value from paper-input

<question-chrome question="{{question}}">
<paper-input label="{{question.Description}}" id="answer" name="answer" type="number">
{{question.Description}}
</paper-input>
</question-chrome>
Where question-chrome.html has the followign code:
<template>
<div class="questioncontainer {{question.Type }}" style="padding-top:10px;">
<div class="questiontext">
<span class="questiontitle">{{question.Title}}</span>
</div>
<div class="questionanswers">
<content select=".questionanswers"></content>
</div>
</div>
</template>
I am using the above paper input, when I am trying to get the values from this, I cannot find the value anywhere. the question element/object, I can get and see every other item's value of the question object. How would I get the value of what is put into the input field? in this case, the value was 3323.
this:
The code to retrieve it I have tried all of these:
this.$.answer.value;
And the results through developer tools in chrome result in:
Object
AdditionalProperties:null
Answers:Array[0]
Code:720061
Description:"Monetary marks ...."
ExtensionData:null
HasAnswers:false
HasChildren:false
Id:"9999dcc3-d3eb-40cf-8414-05ae385e11cf"
IsDefault:true
IsDeleted:false
.....so on and so forth
I went through all of these and did not find it. It is a numeric type of field, so not sure if that has anything to do with it.

How to click element using Cucumber without using xpath?

My application requires to test favorite feature for any product.Products List & UI
When a user click on the heart icon shown in the snippet, it will add that product into Favorites list. I would like to know about the Capybara/Cucumber method to click on the heart icon.
I have tried using XPATH but it seems not working. The code that I tried is as follow.
When(/^I click on the favourite icon on the first product$/) do
find(:xpath,'/html/body/div[1]/div[2]/div/div/div/span/div/div/div/div[3]/div[1]/span[1]/div/div/div/div/div[4]/div[2]/div/favorite/a').click
end
I have also tried following capybara method using XPATH. It is also not working.
When(/^I click on the favourite icon on the first product$/) do
find(:xpath,'//a[contains(., "#heart")]).click
end
Also, I tried following code which is throwing out an error.
When(/^I click on the favourite icon on the first product$/) do
within("div.search-results-wrapper") do
find(first('a.ng-scope')).trigger(:mouseover)
end
end
Error:
The given selector #<Capybara::Node::Element:0x007fd18d841690> is either invalid or does not result in a WebElement. The following error occurred:
InvalidSelectorError: An invalid or illegal selector was specified (Selenium::WebDriver::Error::InvalidSelectorError)
The HTML code for the Favorite icon is as follow:
<favorite product="result" ng-if="!ui.showIpsaProductCell()" class="product-action ng-scope ng-isolate-scope"><a ng-mousedown="product.favoriting = true" ng-mouseenter="product.showList = true" active="::product.favoriting" ng-click="toggle(true)" class="ng-scope active">
<i ng-class="::{
'icon-heart-filled':
product.hasFavorite || !showCount || newProductPage,
'icon-heart-outline':
!product.hasFavorite && showCount && !newProductPage
}" class="heart icon-heart-filled"></i>
<!-- ngIf: ::showCount --><span class="count ng-scope" ng-if="::showCount">
1
</span><!-- end ngIf: ::showCount -->
<!-- ngIf: ::addToList && product.hasFavorite --><div component="add-to-list" ng-if="::addToList && product.hasFavorite" class="ng-scope">
<!-- ngInclude: '/modules/components/add-to-list/add-to-list.tpl.html' --><span ng-include="'/modules/components/add-to-list/add-to-list.tpl.html'" ng-controller="AddToListCtrl" class="ng-scope"><div ng-mouseleave="product.showList = false" class="add-to-list-desktop ng-scope">
<!-- ngIf: product.showList -->
<!-- ngIf: product.showListMenu && product.showList -->
</div>
</span></div><!-- end ngIf: ::addToList && product.hasFavorite -->
</a></favorite>
Since you have multiple "favourite" icons you would need to find your icon within a given parent container, not being able to see the full html page it would go something like:
within(".myParentContainer") do
find(".icon-heart-filled").click
end

Protractor test failing in firefox (unable to find id) but works in ie/chrome

I have a Protractor test that is running successfully against both IE and chrome, but when i run it against firefox an error is returned claiming that it can not find the element on the page - any ideas?
The HTML looks as follows - once the customer types letters into the box it attempts to provide options:
<form data-ng-submit="submit()" data-ng-show="getCurrentTab()===1" class="navbar-form navbar-left" role="search" data-ng-controller="RouteTabController">
<div class="form-group">
<b>FROM</b>
<div ba-auto-complete field="from" class="autoCompleteDirective" id="fromRoute"/>
</form>
The relevant code in the test is as follows:
var actions = browser.actions();
actions.mouseMove(element(by.id('fromRoute')));
actions.click();
actions.sendKeys("ABC");
On a side note I am using that as when I tried the following it claimed the element did not have focus in both chrome and firefox:
element(by.id('fromRoute')).click();
element(by.id('fromRoute')).sendKeys('ABC');
The answer (I'm ashamed to admit) was that my chrome driver was out of date. When I updated that then firefox worked ok

"Could not get the type info from component xml schema" when loading a page in SiteEdit 2009

I enabled inline editing on SitEdit 2009 SP2 using the answer given here
How do I enable inline field editing in SiteEdit when using an XSLT TBB?
but I keep getting this error when loading the resulting page in SiteEdit:
Sys.FormatException: Could not get the type info from component xml schema.
Field: cf_tcm:20-33457-64_content_header
XPath: [1]
My XSLT TBB fragment:
<xsl:if test="//*[local-name()='content_header'] != ''">
<h1>
<div>
<tcdl:ComponentField name="content_header" index="0">
<xsl:value-of select="//*[local-name()='content_header']">
</tcdl:ComponentField>
</div>
</h1>
</xsl:if>
The output in the published file:
<h1>
<div>
<span>
<!-- Start SiteEdit Component Field: {"ID" : "cf_tcm:20-33457-64_content_header", "XPath" : "[1]", "IsMultiValued" : false} -->
<tcdl:ComponentField name="content_header" index="0" SiteEditProcessed="true">
Test
</tcdl:ComponentField>
</span>
</div>
</h1>
What is wrong with my code?
That error message means that the XPath in your <!-- Start SiteEdit Component Field: { ...} --> command does not point to a field in the current Component. Given that your XPath shows up as [1], that sounds pretty accurate.
You'll need to find the cause of the empty XPath being output. In your XSLT you mark the field with a <tcdl:ComponentField> wrapper. This wrapper is later processed by the "Enable Inline Editing" TBB to generate a corresponding <!-- Start SiteEdit Component Field ... --> command. Since the SiteEdit front-end needs an XPath to the field and the tcdl:ComponentField only contains the field name, the TBB will need to look up the XPath based on the field name.
The "Enable Inline Editing" TBB from SiteEdit 2009 looks up the current Component when processing tcdl:ComponentField by looking at the current resolved item (engine.PublishingContext.ResolvedItem.Item.Id). It then looks up the field in that Component to determine its XPath.
If you look at the package in the Template Builder, what is the Component at the bottom of the Package list? Does that Component contain a content_header field?

Resources