Emulating CORS issues with pytest - python

I need to test requests that can be sent through iframe. For example: i have some page on domain_01:
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<style>
body {
margin: 0 auto;
}
</style>
<body>
<iframe id="inlineFrameExample"
title="Inline Frame Example"
width="1600"
height="900"
src="http://domain_02:8000/app/dashboard">
</iframe>
</body>
</html>
And as you can see here this page contains iframe with link to page on domain_02. I try to understand: is it possible to emulate request that goes to domain_02 through this iframe on doamin_01 with pytest.
Main task what i need to solve it's create tests with different requests and check that there is no CORS issues with it.
How i check it now: manually only. I run second web-server through inner python server (python -m http.server 8090) and set dns-record on local dns-server to emulate domain_01. It will be so cool to run this tests with pytest.

Related

JsException(TypeError: Failed to fetch)

When I try to import a pyscript source code to my HTML it shows a "JsException(TypeError: Failed to fetch)" error.
helloworld.py
print("Hello World")
testPyscript.html
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" />
<script defer src="https://pyscript.net/alpha/pyscript.js"></script>
<title></title>
</head>
<body>
<py-script src="helloworld.py">
("Another Text Test")
</py-script>
</body>
</html>
I was having the same problem and found the answer here: PyScript: Loading Python Code in the Browser
The problem is <py-script src="helloworld.py"> do not support loading local files, you need a server for the browser to load it...
Go into the folder you keep the files and run python -m http.server 80 and then, on the browser, go to localhost/testPyscript.html
Hope it helps
For some reason your directory which contains helloworld.py and testPyscript.html need to run in localhost, open your folder in vsCode and install live server from extensions then in your right bottom corner press on Go Live. you will be directed to the default browser with the expected output from helloworld.py

Python & Selenium: How to get Elements in DevTools with CDP (Chrome DevTools Protocol)

I'd like to get all source code in Elements with Chrome DevTools.
Although I tried the following code, these values are not match with the above code.
body = driver.execute_cdp_cmd("DOM.getOuterHTML", {"backendNodeId": 1})
print(body)
Is it possible to get all source code with CDP?
How can I get all source code with CDP?
I know the another way to scrape the source code.
But I'd like to know how to get the source code in Elements in DevTools. (F12)
EDIT: See CDP solution at the end
Assuming by "f12 source code" you mean "the current DOM, after it has been manipulated by JS or anything else, as opposed to the original source code".
so, consider the following html page:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Hi</title>
<script>
document.addEventListener("DOMContentLoaded", function(){
setTimeout(function(){
document.getElementById("test").innerHTML+=" World!"
}, 3000)
});
</script>
</head>
<body>
<h1 id="test">Hello</h1>
</body>
</html>
3 seconds after page load, the h1 will contain "Hello World!"
And that is exactly what we see when running the following code:
from selenium import webdriver
from time import sleep
driver = webdriver.Chrome()
driver.get("http://localhost:8000/") # replace with your page
sleep(6) # probably replace with smarter logic
html = driver.execute_script("return document.documentElement.outerHTML")
print (html)
That outputs:
<html lang="en"><head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Hi</title>
<script>
document.addEventListener("DOMContentLoaded", function(){
setTimeout(function(){
document.getElementById("test").innerHTML+=" World!"
}, 3000)
});
</script>
</head>
<body>
<h1 id="test">Hello World!</h1>
</body></html>
EDIT, using CDP instead:
The behavior you're describing is odd, but okay, let's find a different solution.
It seems there's limited support for CDP in selenium 4 (so far) in python.
as of Now (May 2022) There is no driver.getDevTools() in python, only java and JS (Node) (?).
Anyway, I'm not even sure that would have helped us.
Raw CDP will suffice for now:
from selenium import webdriver
from time import sleep
# webdriver.remote.webdriver.import_cdp()
driver = webdriver.Chrome()
driver.get("http://localhost:8000/")
sleep(6)
doc = driver.execute_cdp_cmd(cmd="DOM.getDocument",cmd_args={})
doc_root_node_id = doc["root"]["nodeId"]
result = driver.execute_cdp_cmd(cmd="DOM.getOuterHTML",cmd_args={"nodeId":doc_root_node_id})
print (result['outerHTML'])
prints:
<!DOCTYPE html><html lang="en"><head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Hi</title>
<script>
document.addEventListener("DOMContentLoaded", function(){
setTimeout(function(){
document.getElementById("test").innerHTML+=" World!"
}, 3000)
});
</script>
</head>
<body>
<h1 id="test">Hello World!</h1>
</body></html>

How do I eliminate extra line in Python multi-line string?

I made a HTML Basic Markup string in Python and I made the string split over multiple lines, however, I ran into a problem. This is an HTML Basic Markup string and I want to to appear like this:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Untitled</title>
</head>
<body>
</body>
</html>
So I created a string in python and this is what it looks like:
HTML_Basic_Markup = """
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Untitled</title>
</head>
<body>
</body>
</html>
"""
When I print HTML_Basic_Markup I get an extra space at the top, so to fix this I did this:
HTML_Basic_Markup = """<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Untitled</title>
</head>
<body>
</body>
</html>
"""
However, I want to make the code look neat and want the Doctype to be aligned with the rest of the code, so how would I remove the line which is created at the top?
String objects support a strip method you can use to remove leading and trailing characters (including newlines). See here.

How to return output of Javascript to python?

I wanted to create a python file say main.py that when i run it it will run my index.html here is the code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Speech API</title>
</head>
<body>
<button class="talk">Talk</button>
<h3 class="content"></h3>
<script src="app.js"></script>
</body>
</html>
In my HTML file there is a button when I click it it will listen to my microphone and listen to what I talk and automatically recognize it. However, after It will run I want to automatically return the recognized words "event.results[current][0].transcript " back to python for printing and do some NLP for my specific application. Here is my JS code:
======app.js
const btn = document.querySelector('.talk');
const content = document.querySelector('.content');
const SpeechRecognition = window.speechRecognition || window.webkitSpeechRecognition;
const recognition = new SpeechRecognition();
recognition.onstart = function (){
console.log('voice is activated on the microphone');
}
recognition.onresult = function(event){
//console.log(event);
var current = event.resultIndex;
var transcript = event.results[current][0].transcript;
content.textContent = transcript;
console.log( event.results[current][0].transcript);
console.log( transcript);
}
//add listerner
btn.addEventListener('click',() => {
recognition.start();
});
The Javascript runs in the browser and knows nothing about the server-side python script that generated it.
If you want to send data back to the server for processing, you should provide that service through a web API, which the Javascript calls.

Python Selenium Get PageSource of XHTML

I was wondering if there was a way to print the entire html path. I am trying to verify some text in a pdf xhtml file pop-up and can not get to to. My hope is to get the entire page source and verify the text is in there. However .page_source seems to only give me the url and description and I am looking to get each line of code.
A possible approach is to make selenium find the starting page tag (html) and get all the source related code.
driver = webdriver.Firefox()
driver.get("http://stackoverflow.com/")
driver.find_element_by_tag_name("html").get_attribute('outerHTML')
Documentation
Output example:
<html webdriver="true"><head>
<title>Stack Overflow</title>
<link rel="shortcut icon" href="https://cdn.sstatic.net/Sites/stackoverflow/img/favicon.ico?v=4f32ecc8f43d">
<link rel="apple-touch-icon image_src" href="https://cdn.sstatic.net/Sites/stackoverflow/img/apple-touch-icon.png?v=c78bd457575a">
<link rel="search" type="application/opensearchdescription+xml" title="Stack Overflow" href="/opensearch.xml">
<meta name="twitter:card" content="summary">
<meta name="twitter:domain" content="stackoverflow.com">
<meta property="og:type" content="website">
<meta name="description" content="Stack Overflow is the largest online community for programmers to learn, share their knowledge, and advance their careers">
<meta property="og:image" itemprop="image primaryImageOfPage" content="https://cdn.sstatic.net/Sites/stackoverflow/img/apple-touch-icon#2.png?v=73d79a89bded">
<meta name="twitter:title" property="og:title" itemprop="title name" content="Stack Overflow">
<meta name="twitter:description" property="og:description" itemprop="description" content="Q&A for professional and enthusiast programmers">
<meta property="og:url" content="http://stackoverflow.com/">
......

Categories