I'm trying to test my directive with #ngneat/spectator version 6.1.1
it('should allow all numbers', () => {
spectator = createDirective('<input appNumbersOnly type="number">')
const input = spectator.query('input') as HTMLInputElement
spectator.typeInElement('1234', input)
expect(input.value).toHaveExactText('1234')
})
That always comes back with input.value being blank. I'm just getting started with spectator. What's the right way to perform this test?
Just use:
expect(input.value).toEqual('1234');
Related
I'm trying to run the below testcase using RTL , and the test is failing with the error "TypeError: Expected container to be an Element, a Document or a DocumentFragment but got string.". I tried searching for solution but couldn't find one .
describe("Feedback Commponent",()=>{
it('should throw error when feedback textbox is empty', () => {
const { getByLabelText} = render(<Contact />);
fireEvent.change(getByLabelText('Feedback'), {
target: { value: '' },
});
fireEvent.blur(getByLabelText('Feedback'));
debug();
expect(getByTestId('feedback-error')).toBe(
'Please Enter Your Feedback'
);
});
});
The above snippet is suppose to test the feedback form , to be specific only the feedback text box , when it is empty and when user goes out of focus from the textbox ,there should be an error stating "Please Enter Your Feedback".
It seems that you imported getByTestId method straight from testing library instead of destructuring it from render like you did with getByLabelText. getByTestId, according to the docs is:
getByTestId(
// If you're using `screen`, then skip the container argument:
container: HTMLElement,
text: TextMatch,
options?: {
exact?: boolean = true,
normalizer?: NormalizerFn,
}): HTMLElement
So it expects the first argument to be the HTML container, hence the error.
One solution would be to destructure getByTestId as well:
const { getByLabelText, getByTestId } = render(<Contact />);
Another one is to use screen, as suggested by the docs:
import { screen } from '#testing-library/react';
...
expect(screen.getByTestId('feedback-error')).toBe(
'Please Enter Your Feedback'
);
In which case the first 'container' argument is skipped and the string 'feedback-error' is treated like test id 'text' argument. Docs:
https://testing-library.com/docs/queries/bytestid
I resolved the issue by changing the assertion to
expect(getByText('Please Enter Your Feedback')).toBeInTheDocument();
from
expect(getByTestId('feedback-error')).toBe('Please Enter Your Feedback');
Also I noticed that I had setupTest.js file with
import '#testing-library/jest-dom/extend-expect';
missing , which adds custom jest matchers for asserting on DOM nodes, so after adding the above changes my test case passed
I'm a newbie in protractor.
I've written a test with Selenium in Java and everything is OK.
But now, i need to do the same test in protractor and it driving me crazy!
I've to check the numbre of element by tagName in my page.
My code is something like this :
// Click on a button
element(by.id('e2e-idAutomate')).click();
// Wait for the next page to be present
var isPresent0 = EC.visibilityOf(element(by.tagName('ngx-carousel')));
var isPresent1 = EC.visibilityOf(element(by.tagName('cmyardneo-action-button')));
var condition = EC.and(isPresent0, isPresent1);
browser.wait(condition, 5000);
// Ok, here i want to chek the number of div by tagName
// First try!
expect<any>(element.all(by.tagName("div"))).toContain(40);
// Doesn't work... Fall in timeout!
// Second try
element.all(by.tagName("div")).then((liste) => { //Same Problem, fall in timeout
expect<any>(liste.length).toBe(40);
});
How can i read the liste return by the element.all?
Thanks!
For time our issue, please refer to http://www.protractortest.org/#/timeouts
One issue in your code:
// First try!
expect(element.all(by.tagName("div")).count()).toBe(40);
// element.all().count() is to get count of found elements
Ok,
After another tests, my problem is not about element.all
but about page change....
What i want to do is :
Open a first page
Click on a button that make à routing to a
second page
check this second page
I ve done something like that :
describe('test of application', function () {
beforeAll( () => {
TR.closeTabs();
browser.driver.manage().window().maximize();
browser.get('/ardoise');
browser.waitForAngularEnabled();
browser.wait(EC.visibilityOf(element(by.id("e2e-idAutomate"))),5000);
});
it('Click on the button', () => { // I will go on the second page
element(by.id('e2e-idAutomate')).click();
});
it('Check the second page', () => {
// brower.sleep(5000);
var isPresent0 = EC.visibilityOf(element(by.tagName('ngx-carousel')));
var isPresent1 = EC.visibilityOf(element(by.tagName('cmyardneo-action-button')));
var condition = EC.and(isPresent0, isPresent1);
// Here i want to be sure the second page is loaded
browser.wait(condition, 5000);
// Next check....
});
});
And the last condition is never OK (I've checked, the two tagName are OK!!!)
It sounds like protractor hasnot seen that a routing occurs...
Hi I have been doing protractor test and I'm having a problem with my tests. My ionic app do have a drop down having a model name and I tried to access it using the model name and it works but the problem is it can not select the exact option that i need to select from that dropdown option. It selects only the first one? I wrote the protractor syntax like this.
element(by.model('generalPowerOfAttorney.grantorGeneralPowerOfAttorneyForm.region')).$('[value="59"]').click();
But this code selects not the value 59 rather value 0 which is the default option. Is there anyone who could help me?
You should add the html source to facilitate the answer.
You can use the filter method in order to get the correct element clicked.
var elements = element.all(by.model('generalPowerOfAttorney.grantorGeneralPowerOfAttorneyForm.region'));
elements.filter(function(elem, index) {
return elem.getText().then(function(text) {
return text === 'value="59"';
});
}).then(function(filteredElem){
if(filteredElem[0] !== undefined){
filteredElem[0].click();
}
else {
throw 'element not found'
}
});
I need to select an element, send values to it, press tab and then send new values.
I can select the element and send values to it but am not being able to send TAB from my keyboard and then send new value.
I used ptor first but then it is being obsoleted, I now am trying to do same by using browser.key but its not working for me.
Please Help !
i wrote a snippet and tested it against google.de (not .com! maybe you have to adjust this) and when sending TAB the next element gets the focus (in this case it's the search button).
the snippet:
describe('Test', function () {
it('should browse to google', function () {
browser.ignoreSynchronization = true;
browser.driver.get('https://www.google.de');
expect(browser.getCurrentUrl()).toEqual('https://www.google.de/');
});
it('should unfocus the search field', function () {
var search = element(by.name('q'));
search.sendKeys(protractor.Key.TAB);
browser.sleep(3000); // 3s to take a look ;)
});
});
I am using auto suggest v.2.1.3 from brandspankingnew.
I have a form with two radio button and a text field and would like to know how to make the auto suggest script pointing to a different php file if one of the radio button is checked.
I tried this but it doesnt work, its always point to the same php file even if second button is checked
Could you please assist?
Many thanks in advance.
My code is as follows:
function targetvalue()
{
for (i=0;i
/>Business Street
var options = {
script:"autosuggest.php?json=true&limit=6&",
varname:"input",
json:true,
shownoresults:false,
maxresults:10,
callback: function (obj) { document.getElementById('name').value = obj.id; }
};
var as_json = new bsn.AutoSuggest('business', options);
var options_xml = {
script: function (input) { return "autosuggest.php?input="+input+"&testid="+document.getElementById('testid').value; },
varname:"input"
};
var as_xml = new bsn.AutoSuggest('business', options_xml);
As for me, the easiest solution is to pass the the button state to the one script eg only one script but can return different results depending on button state. Otherwise you need to rewrite options each time someone clicks on the radio button. The second solution an lead to unpredictable behavior of auto suggest component.
Sample script:
var selectedValue = getRadioSelectedValue("radioGroupName");
var options_xml = { script: function (input) { return "autosuggest.php?input="+input+"&testid="+document.getElementById('testid').value+"&mode="+selectedValue; },
Write getRadioSelectedValue by yourself to get selected radio button value or set some flag on click. Mode param in GET request will indicates the state of the button, so you can return proper response.