Cypress - Chrome Extension not working inside Cypress Test Runner iFrame - javascript

I have a chrome extension that I successfully loaded into my Cypress environment. It shows up successfully in my extensions and I can see that it is turned on. I know it is working because I can open a new tab in the same browser where Cypress is running and it is working fine and making changes to the UI.
The problem is, the main tab that is running the Cypress Test Runner is inside of an iFrame and I suspect that the chrome extension I have loaded cannot interact with it. I believe this issue reflects my problem. However, I tried that solution but with no luck.
There is a blog that I stumbled upon that talks about a solution for fixing this for the React Dev Tools Extension. The following screenshot explains:
However, the extension that I am using does not have some kind of Global Hook like __REACT_DEVTOOLS_GLOBAL_HOOK__ that I can take advantage of as far as I can tell.
I have no idea what to try next, if anyone can provide some guidance I would appreciate it.

I ended up using Puppeteer for testing this particular extension. Puppeteer does not run within an iFrame allowing the extension to be testable, also you can integrate it into Cypress. Its an annoying workaround but I'm not seeing a better way to do it.

Related

Is it possible to view a webpage that is being edited in vscode.dev?

If we are using vscode in the browser to edit an html file or project, is there a way to view the page?
I think I know what you mean.
On my chromebook I use vscode.dev in one browser tab, and then just drag and drop the .html file in to an empty browser tab and it can run Vanilla JS, CSS3, and HTML without anything else.
Refresh after each save, or install a live server. You could also have VScode running node, or whatever, in the background and just edit in vscode.dev, but that seems a bit excessive.
(Before I was using Crostini to run VScode on my chromebook and it would sometimes become very slow, buggy, or keep flickering (gpu style), and I'd have to restart/kill crostini to fix it, so finding vscode.dev has really helped when I can't find time to get to my workstation.)
CodeSwing is an extension that works in vscode.dev that does this.
Description: Interactive coding playground for building web applications (aka swings).
Id: codespaces-contrib.codeswing
VS Marketplace Link:
https://marketplace.visualstudio.com/items?itemName=codespaces-Contrib.codeswing

Testing Angularjs locators

Kind of getting desperate here.
I have a legacy testsuite using AngularJS (5.4.1) driven by Node 8.12.0.
I want to debug some tests but it seems impossible.
Control flow is enabled in the tests, so I followed the docs on the protractor website. Sadly, it does not work.
browser.pause() just get skipped and using browser.debugger() is deprecated from Node 8.
I decided to disable the control flow but I ran into another problem.
We go to a login page before accessing the application, and the angular debugger does not like that. When accessing the non-angular page, the debugger just quits, stating that angular is not defined.
I then turned to Google to see if there are any Chrome extensions that enable me to use the dev tools to test the locators, but to no avail.
Would be great if I can get the debugger working.
Thanks in advance.
Regards
Here is a setup for IntelliJ
(working directory is example)

Add chrome extension to an electron js application for mac osx?

I am building a small always on the top browser with electron. To show the website I am using .
Now my idea is to integrate an adblocker (preferably uBlock origin) into the browser and it should work and affect the webview. As electron is running on chrome (as far as I know) there must be a way this is possible right?
So after googling a bit, I found this:
https://electronjs.org/docs/api/browser-window#browserwindowaddextensionpath
This somehow looks like what I want to achieve. I downloaded the source of uBlock origin an added it to an extra extensions folder into the project. I ran this function both on the BrowserWindow and also my created mainWindow and both give errors or not the expected results (which means not blocking ads).
So am I doing this right? What do I need to change? Is there an easier way? Is there even a way?

PHP:Javascript loading even after removal

I'm analyzing the running time of various components(CSS and JS) using Yslow tool on my PHP website(localhost).
On running Yslow, I get the following components:
I have already deleted the file 'bootstrap-datetimepicker.min.js' from my project, but still it's loading. Why so?
Load the website from within an Incognito window (CTRL+SHIFT+N).
You may very well wish to disable cache while Chrome's webdev tools are open, too.
See the guide here:
https://developer.chrome.com/devtools/docs/settings

Google Chrome console run a command in every page of a particular website

I am visiting a website which I think has a bug. And I have tried running a javascript function (defined by them), after running the function the site works smoothly in that page. After I navigate to a different page, I again have to run the function. So I want it to run automatically after the page loads. I am using google chrome. So, are there any chrome extensions or any built in thing that can do this. Any help will be appreciated.
Thanks in advance.
I think tampermonkey is what you are looking for
https://chrome.google.com/webstore/detail/tampermonkey/dhdgffkkebhmkfjojejmpbldmpobfkfo
Another solution is to write an extension that injects code in the page's context.
It's important, because normally code in the extension is isolated from the page.
Tampermonkey route is probably better though in your case.

Categories