Invoke value on range input - dom-events

I am trying to change a value on a native html5 range input with Cypress. Here is the code:
cy.get('input[type="range"]')
.invoke('val', 5)
.trigger('change')
I get an error that says:
CypressError: Timed out retrying: cy.invoke() errored because the property: 'val' does not exist on your subject.
cy.invoke() waited for the specified property 'val' to exist, but it never did.
I have confirmed the input does exist in the assertion. I have also confirmed it is selecting the proper element (range input.)
Any ideas on what the issue is and why this doesn't work? Cypress documentation indicates this would work for me as shown in their examples.

Try it in the console, there is no val() on this input type (don't know why), but the .value property is available for getting and setting,
so
cy.get('input[type="range"]')
.then($input => $input[0].value = 5);
Codepen for experimenting.
<input type="range" min="5" max="10" step="0.01">
//console.log(document.querySelector('input').val())
console.log(document.querySelector('input').value) // "7.5"
document.querySelector('input').value = 9
console.log(document.querySelector('input').value) // "9"

Related

Google Apps Script ERROR Request time off workflow [duplicate]

Derived from Canonical question for TypeError Cannot [call method / read property / set property] of null in Google Apps Script
Proposed reference for questions like :
Why the Execution order of GS files in a Project causes TypeError: Cannot read property "sayName" from undefined.?
Testing a trigger causes ReferenceError: 'e' is not defined. or TypeError: Cannot read property *...* from undefined
TypeError: Cannot read property "0" from undefined
Google Script send form values by email, error: cannot read property "namedValues"
Not enough details from the OP but three different answers that for different scenarios
TypeError: Cannot call method "getName" of undefined
TypeError: Cannot read property 'value' of undefined (line 3, file "Code"). I have a trigger for on form submit and yet it still has an errorMissing character in property name (OP used value instead of values)
Description
The error message indicates that you are trying to access a property on an Object instance, but during runtime the value actually held by a variable is a special data type undefined.
See key terms definition at the bottom.
Causes:
The error occurs when accessing properties of an object, which does not exist.
If a property doesn't exist in a object, accessing that property results in undefined and eventually a type error, if undefined is accessed like a real object.. This maybe due to typos or using case insensitive names to access a property. A variation of this error with a numeric value in place of property name indicates that an instance of Array was expected. As arrays in JavaScript are objects, everything mentioned here is true about them as well.
const obj = {a:1};
const b = obj.b;//undefined because b isn't available on obj. But doesn't throw a error
console.log(b.toString())//Throws type error
Accessing Arrays index greater than the last element's index
Array.prototype.length returns the number of elements of the Array. This number is always greater than the last element's index, as JavaScript uses 0 based indices. Accessing any index greater than or equal to the length of the array results in this type error. Eg, when accessing 3rd element in a array of length 3,
const a = [[1],[2],[3]];
const getElement3 = a[3];//undefined,because `3`'s index is ``2`` not `3`;But doesn't throw a error
console.log(getElement3[0])//Throws type error
Accessing Event objects without a event:
There is a special case of dynamically constructed objects such as event objects that are only available in specific contexts like making an HTTP request to the app or invoking a function via time or event-based trigger.
The error is a TypeError because an "object" is expected, but "undefined" is received
How to fix
Using default values
Nullish Coalescing operator ?? operator in JavaScript evaluates the right-hand side if the left-hand is null or undefined. An expression like (myVar ?? {}).myProp (or (myVar ?? [])[index] for arrays) will guarantee that no error is thrown, if the property is at least undefined.
One can also provide default values: (myVar ?? { myProp : 2 }) guarantees accessing myProp to return 2 by default. Same goes for arrays: (myVar ?? [1,2,3]).
Checking for type
Especially true for the special case, typeof operator combined with an if statement and a comparison operator will either allow a function to run outside of its designated context (i.e. for debugging purposes) or introduce branching logic depending on whether the object is present or not.
One can control how strict the check should be:
lax ("not undefined"): if(typeof myVar !== "undefined") { //do something; }
strict ("proper objects only"): if(typeof myVar === "object" && myVar) { //do stuff }
Key Terms
Object
It's one of the JavaScript data types.
undefined
It's one of the JavaScript primitive data types.
To learn about the very basics of JavaScript data types and objects see What are JavaScript Data Types? and What exactly is an object? [JavaScript].
Original revision extracted from here (Credit to #OlegValter)

Warning on prepending variables with $

When I have a selector that I use several times, I like to prepend it with $ So if I'm using $('body') all over my script, I'll make a variable, $body. The warning arises, in this particular case, when I do $anElement.appendTo($body) I get the warning:
Argument type JQuery|jQuery|html element is not assignable to parameter type JQuery|element|string
I was told this is actually pretty common and acceptable practice, so is there a way I can turn this warning off? I couldn't seem to find any particular entry that disabled this in the inspections.
What I'm doing is this:
$('<div>,
{class:"aClass", text: "some text"}
).appendTo($body);
The warning is under Javascript > General > Signature Mismatch.

Pass a string in function parameter

I try to call a function with a string as parameter
<input type="checkbox" value={{user.name}} id={{user.name}} ng-click="toggleSelection({{user.name}})">
but I have this error
Syntax Error: Token 'Marcus' is unexpected, expecting [)] at column 20 of the expression [toggleSelection(Julian Marcus)] starting at [Julian Marcus)].
i've tried toggleSelection('{{user.name}}') and toggleSelection("{{user.name}}") but still the same problem
Though #TOM has answered the question but doen't explained why it doen't work.
You should not use {{}} inside ng-click because ng-click does direct access do the scope variable without using interpolation {{}} directive.
The error you are finding because while evaluating toggleSelection({{user.name}}) this function $parser throws Syntax Error:
You could just fixed it by using direct scope variable.
ng-click="toggleSelection(user.name)"
You don't need angular to parse your string, just pass the object user.name
<input type="checkbox"
value="{{user.name}}"
id="{{user.name}}"
ng-click="toggleSelection(user.name)">
I've also added quotes around your value and id properties.

ComboBox(evt.target) - What does that mean?

Reading up on ComboBox component → Link
The last code example has this line request.url = ComboBox(evt.target).selectedItem.data;
What does ComboBox(evt.target) mean? Type casting? Why would you type cast?
For curiosity reasons, I replaced the last line of changeHandler() with it too: ComboBox(evt.target).selectedIndex = -1;. It works. Does it make the handler function more flexible, since I'm not referencing aCb instance?
you are casting the trigger of the event as a ComboBox. You do this to explictly say that this variable is of this type. You don't have to most of the times but when you do you get these advantages
When you are checking what the type is
You get all of the methods in the type Class (In this case Combo Box) as autocomplete options in your IDE
Will throw an error if evt.target is not of type ComboBox after all
Also is a visual indicator of what variable it is. Very helpful when revisiting code

GAS - data error for ScriptProperties.setProperty("myName", null);

I am trying to learn about the ScriptProperties object in GAS.
I tried setting a property to a value of null, and I get an error.
I can understand if like JavaScript, setting a value of null undefines
that property.
But why are you disallowing this value?
It seems reasonable (to me) to allow a script to undefine a script (or user) property.
Another question about ScriptProperties (and I assume the same holds for UserProperties),
Why when I display the value of an undefined property it displays as "undefined",
but when I try to test for the value "undefined" (without quotes) it does not match?
It seems, that if you are going to introduce a new special attribute value of "undefined", it should be consistent through out the system. If by "undefined" you mean null, well then
why not display it with the word "null"?
I am just trying to learn about this new environment.
All help is appreciated. Thanks for your support.
There is an open feature request to add support for removing properties, which you can star for updates.
The value "undefined" is not a string but rather a special value built in to JavaScript. You can refer to it like "null":
if (foo == undefined) { ...
More information is available on the w3schools page.