Playwright fails to fill input - node.js

I'm running a Playwright script on a Jenkins page that has input elements. When I try to fill one of the inputs with text, it fails with this error:
(node:3337) UnhandledPromiseRejectionWarning: page.fill: Protocol error (Page.insertText): error in channel "content::page": exception while running method "insertText" in namespace "page": Component returned failure code: 0xc1f30001 (NS_ERROR_NOT_INITIALIZED) [nsITextInputProcessor.commitCompositionWith] _insertText#chrome://juggler/content/content/PageAgent.js:891:32
I've tried running with DEBUG=pw:api environment enabled but the logs there aren't too helpful. From the normal console log I get the following log:
waiting for selector "input[name="_.buildNumber"]"
selector resolved to visible <input value="" type="text" name="_.buildNumber" class=…/>
elementHandle.fill("54")
waiting for element to be visible, enabled and editable
element is visible, enabled and editable
So it seems like the element exists and can be edited but for some reason Playwright is unsuccessful at trying to fill it. What am I missing here?

This is a Playwright bug that is specific to Firefox. To get around it for now, you should be able to switch to using either Chrome or Safari in your import statement. So either:
import { chromium } from 'playwright';
Or using Safari:
import { webkit } from 'playwright';

Related

Electron NodeJS Ag-Grid Cannot Import

In render.js I have
import { Grid } from 'ag-grid-community';
import { tableMethods } from './table.js';
I created my own custom table methods and decided to try ag-grid since mine aren't as fast as theirs (no surprise). Unfortunately, while I could get my own methods loading from my js file by setting
<script type="module" src="render.js"></script>
I cannot get ag-grid to load, I get this error
Uncaught TypeError: Failed to resolve module specifier "ag-grid-community". Relative references must start with either "/", "./", or "../".
I used npm i ag-grid-community -D to install it. I wasn't sure if I needed the -D, so I tried without that and it still shows same error.
*Note - of course I've tried doing what the error message says. But it didn't resolve and the documentation doesn't mention anything about this.
I was able to get this working by adding following before my render.js file
<script src="ag-grid-community.js"></script>
I also disabled type=module once I realized this is probably the intended way to split up rendering scripts, or at least that was my guess.

Timeout Error while using selenium firefox webdriver in VBA

I am trying to use selenium firefox webdriver to navigate to a page and initiate a click event. This event should paste a csv data onto the clipboard. Upon executing this code the firefox window pops up without any url in the address bar and then I get the following error message:
Error: TimeoutError
Firefox failed to open the listening port 127.0.0.1:12825 with 15s
Here is my code
Set objFireFox = CreateObject("Selenium.FirefoxDriver")
objFireFox.Get "https://chartink.com/screener/practical-swing-trading-stock-scanner", 20000, False
objFireFox.FindElementsByClass("btn btn-default buttons-copy buttons-html5 btn-primary").Click
Initially I was using the following statement
objFireFox.Get "https://chartink.com/screener/practical-swing-trading-stock-scanner"
then I modified it to
objFireFox.Get "https://chartink.com/screener/practical-swing-trading-stock-scanner", 20000, False
but still the error message was same in both cases. I have downloaded the latest version of mozilla/geckodriver from https://github.com/mozilla/geckodriver/releases/tag/v0.30.0
Thanks

Basic use of node-installed component (eg datepicker)

I want to use a vue3 datepicker component. However, I can't seem to get it started.
After installing datepicker using npm -i vue3-datepicker, I entered the supplied code into a local html file:
<script setup>
import Datepicker from '../src/datepicker/Datepicker.vue'
import { ref } from 'vue'
const picked = ref(new Date())
</script>
<template>
<datepicker v-model="picked" />
</template>
I saved and opened the file, but the code doesn't seem to do anything.
The example code doesn't even have an input element to connect the calendar to.
The error from the Chrome console is
Uncaught SyntaxError: Cannot use import statement outside a module
How can I get a datepicker up and running? What am I missing? Can someone help with a more complete example (totally working code?)

elementIsNotVisible throwing noSuchElementError in Selenium

I wrote a test to ensure a slideout panel closes in my selenium tests using node js. Whenever I close the panel I use the condition elementIsNotVisible. However an error is thrown, noSuchElementError. This error is technically correct because the element should no longer be on the page, but shouldn't elementIsNotVisible be correct as well?
Test.js file:
await driver.wait(until.elementIsVisible(testPage.addAllAnnotationsButton(driver)), 20000);
await testPage.exitGeneAnnotationsButton(driver).click();
await driver.wait(until.elementIsNotVisible(testPage.addAllAnnotationsButton(driver)), 20000);
Page.js file:
const testPage = {
addAllAnnotationsButton: driver => driver.findElement(By.css(testPage.addAllAnnotationsButtonSELECTOR))
}
Error message(Note- Error message is thrown on the line where elementIsNotVisible is called):
NoSuchElementError: no such element: Unable to locate element: {"method":"css selector","selector":"div.slideout.opened:nth-child(6) button.ui.button.medium:nth-child(2)"}
Edit 1: Please note, I have tried using stalenessOf and I still receive the same error.
As you have mentioned that when you close the panel, you use the condition elementIsNotVisible :
Here once you have closed the panel , the respective web element is not present in DOM. That is the reason you are getting NoSuchElement exception.
Suggestion : Use invisiblityofElement instead of elementIsNotVisible.
Though there are many reasons behind NoSuchElement Exception, one of the most common is try to interact with element/elements present in frame/iframe without switching the focus of web driver.
Hope this will help.

Using canvas drawImage in chrome extension content script

I'm trying to use drawImage on Canvas Context in injected content script from my Chrome Extension.
testCanvas = document.createElement('canvas');
testContext = testCanvas.getContext('2d');
var image = new Image();
testContext.drawImage(image, 0, 0);
In Chrome 26 it works ok, but in dev channel (Chrome 28) this seams broken as I got this message:
Uncaught TypeError: Type error
When I move same script directly into background page, it works without any problem.
I think this can be related to some security related change but I failed to find any relevant information.
This is a bug, you should report it. Some more testing reveals that in Chrome 28.0.1498.0, the Image constructor does not create a valid HTMLImageElement instance (as seen in the screenshot below).
This code is run in the context of a Content script. The same code works fine on regular pages and in the extension's process (background page).
To work around the problem, use document.createElement('img') instead of new Image().
And don't forget to report the bug at https://code.google.com/p/chromium/issues/list.

Resources