** <input type="number" id="userGuess" />**
I have created an input on the line above
And through the line below, I have put it in a variable
const userValue = document.querySelector('#userGuess').value;
But when I enter a value in input the web page. It does not print
console.log(userValue)
I expect, when I enter a value in the generated input. I can get it through console.log or** alert**
Related
Using react-hook-form, and zod within a Next.js project. Trying to get .optional() to work. It works with simple strings. See the schema below.
//works
const FormSchema = z.object({
website: z.string().optional()
});
But it does not work when I add the .url() flag. It only checks for the valid url. If the field is blank, it throws an error. In other words, the field is no longer optional. It accepts a valid url, but not a blank input field. Of course I want it to accept a blank input and a valid url as the only valid inputs.
//not working. the field is no longer optional.
const FormSchema = z.object({
website: z.string().url().optional()
})
Perhaps the problem has to do with the input field returning the wrong data-type when it's blank?
<label className="block">
<span className="block text-white">Website</span>
<input
id="email-input"
type="text"
className={`block border text-lg px-4 py-3 mt-2 border-gray-200 focus:bg-white text-gray-900 focus:ring-purpleLight focus:ring-2 outline-none w-full disabled:bg-gray-100 disabled:text-gray-400 disabled:cursor-not-allowed`}
{...register("website")}
disabled={isSubmitting}
placeholder="Website"
value={undefined}
/>
</label>
{errors.website && (
<p className="mt-1 text-sm text-red-600">
{errors.website.message}
</p>
)}
Perhaps the problem has to do with the input field returning the wrong data-type when it's blank?
I think this is likely your problem, although I'm not familiar with what react-hook-form might be doing to transform the input before handing it to your schema. The empty field will have the empty string '' as a value when it's blank. If you just use zod directly:
z.string().optional().parse(''); // succeeds because '' is a string
// Whereas this will fail because although '' is a string, it does not
// match the url pattern.
z.string().url().optional().parse('');
.optional() allows for the input value to be undefined so for example:
// These will both successfully parse because of `optional`
z.string().optional().parse(undefined);
z.string().url().optional().parse(undefined);
Going out slightly on a limb here, but if you wanted '' to pass you could add a preprocess step where you convert '' to undefined:
const s = z.preprocess(
(arg) => (arg === "" ? undefined : arg),
z.string().url().optional()
);
console.log(s.safeParse("")); // success (data: undefined)
console.log(s.safeParse("test")); // failure (not a url)
console.log(s.safeParse(undefined)); // success (data: undefined)
I have a form field;
[hidden path default:shortcode_attr] which is successfully populated in the form to produce <input type="hidden" name="path" value="uploads/my-file.pdf" class="wpcf7-form-control wpcf7-hidden">
Then it's added to the mail by;
add_filter('wpcf7_mail_components', 'attach_files_based_on_field',10,3);
function attach_files_based_on_field($components, $form, $mail){
//get the form submited data
$submission = WPCF7_Submission::get_instance();
$data = $submission->get_posted_data('path');
$components['attachments'][] = $data;
return $components;
}
(thanks to #Aurovrata in this answer)
The issue is that although it appears the file is attached, it is empty (zero bytes).
It is also empty if the $data is replaced by the literal "uploads/my-file.pdf"
Needles to say this file is not empty. if it's entered in the Mail > Attachments field in CF7 as "uploads/my-file.pdf" it works (alongside the empty file)
Can anyone help me how to store date from a field to variable. Here is the HTML which I am looking at:
<input id="date" class="input_date" id="XYZ" type="date" value="2019-01-12" on_input="table()">
I tried:
const date1 = Cypress.moment(). get('#id_value')
If the ID's are unique, you could try getting the val into a variable as below. I have used date id in the below code.
note: In the input html tag there two ID's, may be need to confirm with dev team which one to be used here
cy.get('#date').invoke('val').then((val)=>{
const dateValue = val;
console.log("Here is the date:"+dateValue);
})
Although Cypress imports the moment library, there are no built in commands for it that allow chaining, but you can add a custom command to make it easier.
The toMoment() command must be chained off a previous selecting command like cy.get() or cy.contains(). It returns a moment object which you can then use invoke to call all the methods moment provides, and further chain .should() to test the value returned from those methods.
For example,
Spec
Cypress.Commands.add('toMoment', {prevSubject: true}, (element) => {
return Cypress.moment(element[0].value);
});
it('input tests with moment', () => {
cy.visit('./app/moment-with-input.html');
cy.get('input').toMoment()
.invoke('isValid')
.should('eq', true);
cy.get('input').toMoment()
.invoke('format', 'dddd')
.should('eq', 'Saturday');
cy.get('input').toMoment()
.invoke('diff', Date(2020, 2, 5), 'days')
.should('eq', -391);
})
HTML fragment (put in '/app' folder of project)
<input id="date" class="input_date" id="XYZ" type="date" value="2019-01-12" on_input="table()">
When I tried to enter a text in the below input field I am getting the error although it displayed in the window. The following input element html code is given below. I couldn't understand the reason for the error and unable to find the solution " WebDriverError: unknown error: a.tagName.toUpperCase is not a function"
<input type="text" ng-model="$ctrl.tag.name" ng-if="$ctrl.isSelectedMode" autofocus="autofocus" ng-blur="$ctrl.saveTagName()" name="tagName" ng-keyup="$ctrl.escapeEditing($event)" form-validator="$ctrl.tagName.uniqueError.validator" class="ng-valid ng-valid-uniqueness ng-not-empty ng-dirty ng-valid-parse ng-touched" autocomplete="off" style="">
I have written code in Page Object Model
this.AddTag = function(tagname1,tagname2,tagname3){
let clickAddTag = element(by.xpath("//*[text()='Add Tag']"));
clickAddTag.click();
browser.sleep(2000);
let AddTag = element(by.xpath("//input[#name='tagName']"));
if(AddTag.isPresent()){
AddTag.sendKeys(tagname1);
AddTag.sendKeys(protractor.Key.ENTER);
clickAddTag.click();
AddTag.sendKeys(tagname2);
AddTag.sendKeys(protractor.Key.ENTER);
clickAddTag.click();
AddTag.sendKeys(tagname3);
AddTag.sendKeys(protractor.Key.ENTER);
}
In specs I am calling the method
BidConfiguration.AddTag('tag1','tag2','tag3');
It's because you are trying to uppercase not string but HTML element.
more less stg like that:
element(by.xpath("//*[text()='Add Tag']")).toUpperCase();
You probably want to change text of the element to uppercase.
Try:
element(by.xpath("//*[text()='Add Tag']")).getText().then((elementText) => {
console.log(elementText.toUpperCase());
});
I found the solution
use actions class with sendKeys
browser.actions.click(element).sendKeys('text').perform();
I have this program that I am coding, the main thing is mostly to get familiar with Jax-rs and rest API. I am sending from a form in JSP page one input and with POST I pass it to my java Response class(that I use annotation #FormParam), it does what calculation I need and then I get the result in another link, what can i do to take the result just below my button on the same page? For my button function I use javascript, and when I push it I don't want to be redirected and take the result like this.
So i use this form and a javascript function in my jsp to pass the value in my POST method in java throw #FormParam
<form name="Form1" method="post">
<p>
Name : <input type="text" name="malename" id="malename" autofocus
value="enter your name..." />
</p>
<input type="submit" name="action" id="malename" value="I'm feeling lucky"
onclick="OnButton1();"> </form>
function OnButton1() {
document.Form1.action = "webapi/perfectmatcher/mate"
document.Form1.target = "_self"; // Open in a new window
document.Form1.submit(); // Submit the page
//return;
}
Here after i have the value i use two other classes to do the calculations and return the result i need. In a few words i pass a value in my form and when i push the button i am redirected in another link(the path of POST) and i display the result. I want to display the result below my button. I hope the code is helpful and i hope i am clear with my explanation
#POST
#Path("/mate")
#Produces(MediaType.TEXT_PLAIN)
public Response postMaleName(#FormParam("malename") String malename) {
String femalename = NumMatcher.numMatcher(Numberizer.numberizer(malename));
// FemaleName female = new FemaleName(femalename);
female.setName(femalename);
System.out.println(female.getName());
return Response.status(200).entity("Perfect Match for " + malename + " is " + femalename).build();
}
P.S.:The object female that i am trying to create its for testing purposes, i was trying somehow to get the information that i store but i cannot find how!!I used even jsp expressions but i get null value of course ...
<%
FemaleName female = new FemaleName("john");
String string = female.getName();
out.print(string);
%>