jprdonnelly/pyscript
1
0
Fork 0
mirror of https://github.com/pyscript/pyscript.git synced 2025-12-22 19:53:00 -05:00
Code Issues Projects Releases Wiki Activity

Fix #2114 - Cleanup the test folder + automation (#2143)

Browse Source 
* Fix #2114 - Cleanup the test folder + automation
* Merged both test and tests into a single folder
This commit is contained in:
Andrea Giammarchi
2024-08-08 17:08:59 +02:00
committed by GitHub
parent f4c4edeb29
commit 9f46234f71
104 changed files with 193 additions and 221 deletions
Download Patch File Download Diff File Expand all files Collapse all files

130
pyscript.core/tests/pyscript_dom/index.html Normal file
View File

@@ -0,0 +1,130 @@
<html lang="en">
<head>
<title>PyDom Test Suite</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<link rel="stylesheet" href="../../dist/core.css">
<script type="module" src="../../dist/core.js"></script>
<style>
@import url("https://fonts.googleapis.com/css?family=Roboto:100,400");
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
*:before, *:after {
box-sizing: inherit;
-webkit-font-smoothing: antialiased;
}
body {
font-family: "Courier New", Courier, "Lucida Sans Typewriter", "Lucida Typewriter", monospace;
font-size: 14px; font-style: normal; font-variant: normal; font-weight: 400; line-height: 20px;
}
h1 { font-size: 24px; font-weight: 700; line-height: 26.4px; }
h2 { font-size: 14px; font-weight: 700; line-height: 15.4px; }
#tests-terminal{
padding: 20px;
}
</style>
</head>
<body>
<script type="py" src="run_tests.py" config="tests.toml"></script>
<h1>pyscript.dom Tests</h1>
<p>You can pass test parameters to this test suite by passing them as query params on the url.
For instance, to pass "-v -s --pdb" to pytest, you would use the following url:
<label style="color: blue">?-v&-s&--pdb</label>
</p>
<div id="tests-terminal"></div>
<template id="test_card_with_element_template">
<p>This is a test. {foo}</p>
</template>
<div id="test_id_selector" style="visibility: hidden;">You found test_id_selector</div>
<div id="test_class_selector" class="a-test-class" style="visibility: hidden;">You found test_class_selector</div>
<div id="test_selector_w_children" class="a-test-class" style="visibility: hidden;">
<div id="test_selector_w_children_child_1" class="a-test-class" style="visibility: hidden;">Child 1</div>
<div id="test_selector_w_children_child_2" style="visibility: hidden;">Child 2</div>
</div>
<div id="div-no-classes"></div>
<div style="visibility: hidden;">
<h2>Test Read and Write</h2>
<div id="test_rr_div">Content test_rr_div</div>
<h3 id="test_rr_h3">Content test_rr_h3</h3>
<div id="multi-elem-div" class="multi-elems">Content multi-elem-div</div>
<p id="multi-elem-p" class="multi-elems">Content multi-elem-p</p>
<h2 id="multi-elem-h2" class="multi-elems">Content multi-elem-h2</h2>
<form>
<input id="test_rr_input_text" type="text" value="Content test_rr_input_text">
<input id="test_rr_input_button" type="button" value="Content test_rr_input_button">
<input id="test_rr_input_email" type="email" value="Content test_rr_input_email">
<input id="test_rr_input_password" type="password" value="Content test_rr_input_password">
</form>
<select id="test_select_element"></select>
<select id="test_select_element_w_options">
<option value="1">Option 1</option>
<option value="2" selected="selected">Option 2</option>
</select>
<select id="test_select_element_to_clear">
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="4">Option 4</option>
</select>
<select id="test_select_element_to_remove">
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="3">Option 3</option>
<option value="4">Option 4</option>
</select>
<div id="element-creation-test"></div>
<button id="a-test-button">I'm a button to be clicked</button>
<button>I'm another button you can click</button>
<button id="a-third-button">2 is better than 3 :)</button>
<div id="element-append-tests"></div>
<p class="collection"></p>
<div class="collection"></div>
<h3 class="collection"></h3>
<div id="element_attribute_tests"></div>
</div>
<script defer>
console.log("remapping console.log")
const terminalDiv = document.getElementById("tests-terminal");
const log = console.log.bind(console)
let testsStarted = false;
console.log = (...args) => {
let txt = args.join(" ");
let token = "<br>";
if (txt.endsWith("FAILED"))
token = " ❌<br>";
else if (txt.endsWith("PASSED"))
token = " ✅<br>";
if (testsStarted)
terminalDiv.innerHTML += args.join(" ") + token;
log(...args)
// if we got the flag that tests are starting, then we can start logging
if (args.join(" ") == "tests starting")
testsStarted = true;
}
</script>
</body>
</html>

7
pyscript.core/tests/pyscript_dom/run_tests.py Normal file
View File

@@ -0,0 +1,7 @@
print("tests starting")
import pytest
from pyscript import window
args = window.location.search.replace("?", "").split("&")
pytest.main(args)

8
pyscript.core/tests/pyscript_dom/tests.toml Normal file
View File

@@ -0,0 +1,8 @@
packages = [
"pytest"
]
[[fetch]]
from = "tests/"
files = ["__init__.py", "conftest.py", "test_dom.py"]
to_folder = "tests"

0
pyscript.core/tests/pyscript_dom/tests/__init__.py Normal file
View File

15
pyscript.core/tests/pyscript_dom/tests/conftest.py Normal file
View File

@@ -0,0 +1,15 @@
import pytest
from js import document, localStorage
@pytest.fixture(autouse=True)
def before_tests():
"""
Ensure browser storage is always reset to empty. Remove the app
placeholder. Reset the page title.
"""
localStorage.clear()
# app_placeholder = document.querySelector("pyper-app")
# if app_placeholder:
# app_placeholder.remove()
document.querySelector("title").innerText = "Web API PyTest Suite"

460
pyscript.core/tests/pyscript_dom/tests/test_dom.py Normal file
View File

@@ -0,0 +1,460 @@
from pyscript import document, when
from pyscript.web import Element, ElementCollection, div, p, page
class TestDocument:
def test__element(self):
assert page.body._dom_element == document.body
assert page.head._dom_element == document.head
def test_getitem_by_id():
# GIVEN an existing element on the page with a known text content
id_ = "test_id_selector"
txt = "You found test_id_selector"
selector = f"#{id_}"
# EXPECT the element to be found by id
result = page.find(selector)
div = result[0]
# EXPECT the element text value to match what we expect and what
# the JS document.querySelector API would return
assert document.querySelector(selector).innerHTML == div.innerHTML == txt
# EXPECT the results to be of the right types
assert isinstance(div, Element)
assert isinstance(result, ElementCollection)
def test_getitem_by_class():
ids = [
"test_class_selector",
"test_selector_w_children",
"test_selector_w_children_child_1",
]
expected_class = "a-test-class"
result = page.find(f".{expected_class}")
# EXPECT to find exact number of elements with the class in the page (== 3)
assert len(result) == 3
# EXPECT that all element ids are in the expected list
assert [el.id for el in result] == ids
def test_read_n_write_collection_elements():
elements = page.find(".multi-elems")
for element in elements:
assert element.innerHTML == f"Content {element.id.replace('#', '')}"
new_content = "New Content"
elements.innerHTML = new_content
for element in elements:
assert element.innerHTML == new_content
class TestElement:
def test_query(self):
# GIVEN an existing element on the page, with at least 1 child element
id_ = "test_selector_w_children"
parent_div = page.find(f"#{id_}")[0]
# EXPECT it to be able to query for the first child element
div = parent_div.find("div")[0]
# EXPECT the new element to be associated with the parent
assert div.parent == parent_div
# EXPECT the new element to be an Element
assert isinstance(div, Element)
# EXPECT the div attributes to be == to how they are configured in the page
assert div.innerHTML == "Child 1"
assert div.id == "test_selector_w_children_child_1"
def test_equality(self):
# GIVEN 2 different Elements pointing to the same underlying element
id_ = "test_id_selector"
selector = f"#{id_}"
div = page.find(selector)[0]
div2 = page.find(selector)[0]
# EXPECT them to be equal
assert div == div2
# EXPECT them to be different objects
assert div is not div2
# EXPECT their value to always be equal
assert div.innerHTML == div2.innerHTML
div.innerHTML = "some value"
assert div.innerHTML == div2.innerHTML == "some value"
def test_append_element(self):
id_ = "element-append-tests"
div = page.find(f"#{id_}")[0]
len_children_before = len(div.children)
new_el = p("new element")
div.append(new_el)
assert len(div.children) == len_children_before + 1
assert div.children[-1] == new_el
def test_append_dom_element_element(self):
id_ = "element-append-tests"
div = page.find(f"#{id_}")[0]
len_children_before = len(div.children)
new_el = p("new element")
div.append(new_el._dom_element)
assert len(div.children) == len_children_before + 1
assert div.children[-1] == new_el
def test_append_collection(self):
id_ = "element-append-tests"
div = page.find(f"#{id_}")[0]
len_children_before = len(div.children)
collection = page.find(".collection")
div.append(collection)
assert len(div.children) == len_children_before + len(collection)
for i in range(len(collection)):
assert div.children[-1 - i] == collection[-1 - i]
def test_read_classes(self):
id_ = "test_class_selector"
expected_class = "a-test-class"
div = page.find(f"#{id_}")[0]
assert div.classes == [expected_class]
def test_add_remove_class(self):
id_ = "div-no-classes"
classname = "tester-class"
div = page.find(f"#{id_}")[0]
assert not div.classes
div.classes.add(classname)
same_div = page.find(f"#{id_}")[0]
assert div.classes == [classname] == same_div.classes
div.classes.remove(classname)
assert div.classes == [] == same_div.classes
def test_when_decorator(self):
called = False
just_a_button = page.find("#a-test-button")[0]
@when("click", just_a_button)
def on_click(event):
nonlocal called
called = True
# Now let's simulate a click on the button (using the low level JS API)
# so we don't risk dom getting in the way
assert not called
just_a_button._dom_element.click()
assert called
def test_inner_html_attribute(self):
# GIVEN an existing element on the page with a known empty text content
div = page.find("#element_attribute_tests")[0]
# WHEN we set the html attribute
div.innerHTML = "<b>New Content</b>"
# EXPECT the element html and underlying JS Element innerHTML property
# to match what we expect and what
assert div.innerHTML == div._dom_element.innerHTML == "<b>New Content</b>"
assert div.textContent == div._dom_element.textContent == "New Content"
def test_text_attribute(self):
# GIVEN an existing element on the page with a known empty text content
div = page.find("#element_attribute_tests")[0]
# WHEN we set the html attribute
div.textContent = "<b>New Content</b>"
# EXPECT the element html and underlying JS Element innerHTML property
# to match what we expect and what
assert (
div.innerHTML
== div._dom_element.innerHTML
== "&lt;b&gt;New Content&lt;/b&gt;"
)
assert div.textContent == div._dom_element.textContent == "<b>New Content</b>"
class TestCollection:
def test_iter_eq_children(self):
elements = page.find(".multi-elems")
assert [el for el in elements] == [el for el in elements.elements]
assert len(elements) == 3
def test_slices(self):
elements = page.find(".multi-elems")
assert elements[0]
_slice = elements[:2]
assert len(_slice) == 2
for i, el in enumerate(_slice):
assert el == elements[i]
assert elements[:] == elements
def test_style_rule(self):
selector = ".multi-elems"
elements = page.find(selector)
for el in elements:
assert el.style["background-color"] != "red"
elements.style["background-color"] = "red"
for i, el in enumerate(page.find(selector)):
assert elements[i].style["background-color"] == "red"
assert el.style["background-color"] == "red"
elements.style.remove("background-color")
for i, el in enumerate(page.find(selector)):
assert el.style["background-color"] != "red"
assert elements[i].style["background-color"] != "red"
def test_when_decorator(self):
called = False
buttons_collection = page.find("button")
@when("click", buttons_collection)
def on_click(event):
nonlocal called
called = True
# Now let's simulate a click on the button (using the low level JS API)
# so we don't risk dom getting in the way
assert not called
for button in buttons_collection:
button._dom_element.click()
assert called
called = False
class TestCreation:
def test_create_document_element(self):
# TODO: This test should probably be removed since it's testing the elements
# module.
new_el = div("new element")
new_el.id = "new_el_id"
assert isinstance(new_el, Element)
assert new_el._dom_element.tagName == "DIV"
# EXPECT the new element to be associated with the document
assert new_el.parent is None
page.body.append(new_el)
assert page.find("#new_el_id")[0].parent == page.body
def test_create_element_child(self):
selector = "#element-creation-test"
parent_div = page.find(selector)[0]
# Creating an element from another element automatically creates that element
# as a child of the original element
new_el = p("a div", classes=["code-description"], innerHTML="Ciao PyScripters!")
parent_div.append(new_el)
assert isinstance(new_el, Element)
assert new_el._dom_element.tagName == "P"
# EXPECT the new element to be associated with the document
assert new_el.parent == parent_div
assert page.find(selector)[0].children[0] == new_el
class TestInput:
input_ids = [
"test_rr_input_text",
"test_rr_input_button",
"test_rr_input_email",
"test_rr_input_password",
]
def test_value(self):
for id_ in self.input_ids:
expected_type = id_.split("_")[-1]
result = page.find(f"#{id_}")
input_el = result[0]
assert input_el._dom_element.type == expected_type
assert input_el.value == f"Content {id_}" == input_el._dom_element.value
# Check that we can set the value
new_value = f"New Value {expected_type}"
input_el.value = new_value
assert input_el.value == new_value
# Check that we can set the value back to the original using
# the collection
new_value = f"Content {id_}"
result.value = new_value
assert input_el.value == new_value
def test_set_value_collection(self):
for id_ in self.input_ids:
input_el = page.find(f"#{id_}")
assert input_el.value[0] == f"Content {id_}" == input_el[0].value
new_value = f"New Value {id_}"
input_el.value = new_value
assert input_el.value[0] == new_value == input_el[0].value
# TODO: We only attach attributes to the classes that have them now which means we
# would have to have some other way to help users if using attributes that aren't
# actually on the class. Maybe a job for __setattr__?
#
# def test_element_without_value(self):
# result = page.find(f"#tests-terminal"][0]
# with pytest.raises(AttributeError):
# result.value = "some value"
#
# def test_element_without_value_via_collection(self):
# result = page.find(f"#tests-terminal"]
# with pytest.raises(AttributeError):
# result.value = "some value"
class TestSelect:
def test_select_options_iter(self):
select = page.find(f"#test_select_element_w_options")[0]
for i, option in enumerate(select.options, 1):
assert option.value == f"{i}"
assert option.innerHTML == f"Option {i}"
def test_select_options_len(self):
select = page.find(f"#test_select_element_w_options")[0]
assert len(select.options) == 2
def test_select_options_clear(self):
select = page.find(f"#test_select_element_to_clear")[0]
assert len(select.options) == 3
select.options.clear()
assert len(select.options) == 0
def test_select_element_add(self):
# GIVEN the existing select element with no options
select = page.find(f"#test_select_element")[0]
# EXPECT the select element to have no options
assert len(select.options) == 0
# WHEN we add an option
select.options.add(value="1", html="Option 1")
# EXPECT the select element to have 1 option matching the attributes
# we passed in
assert len(select.options) == 1
assert select.options[0].value == "1"
assert select.options[0].innerHTML == "Option 1"
# WHEN we add another option (blank this time)
select.options.add("")
# EXPECT the select element to have 2 options
assert len(select.options) == 2
# EXPECT the last option to have an empty value and html
assert select.options[1].value == ""
assert select.options[1].innerHTML == ""
# WHEN we add another option (this time adding it in between the other 2
# options by using an integer index)
select.options.add(value="2", html="Option 2", before=1)
# EXPECT the select element to have 3 options
assert len(select.options) == 3
# EXPECT the middle option to have the value and html we passed in
assert select.options[0].value == "1"
assert select.options[0].innerHTML == "Option 1"
assert select.options[1].value == "2"
assert select.options[1].innerHTML == "Option 2"
assert select.options[2].value == ""
assert select.options[2].innerHTML == ""
# WHEN we add another option (this time adding it in between the other 2
# options but using the option itself)
select.options.add(
value="3", html="Option 3", before=select.options[2], selected=True
)
# EXPECT the select element to have 3 options
assert len(select.options) == 4
# EXPECT the middle option to have the value and html we passed in
assert select.options[0].value == "1"
assert select.options[0].innerHTML == "Option 1"
assert (
select.options[0].selected
== select.options[0]._dom_element.selected
== False
)
assert select.options[1].value == "2"
assert select.options[1].innerHTML == "Option 2"
assert select.options[2].value == "3"
assert select.options[2].innerHTML == "Option 3"
assert (
select.options[2].selected
== select.options[2]._dom_element.selected
== True
)
assert select.options[3].value == ""
assert select.options[3].innerHTML == ""
# WHEN we add another option (this time adding it in between the other 2
# options but using the JS element of the option itself)
select.options.add(
value="2a", html="Option 2a", before=select.options[2]._dom_element
)
# EXPECT the select element to have 3 options
assert len(select.options) == 5
# EXPECT the middle option to have the value and html we passed in
assert select.options[0].value == "1"
assert select.options[0].innerHTML == "Option 1"
assert select.options[1].value == "2"
assert select.options[1].innerHTML == "Option 2"
assert select.options[2].value == "2a"
assert select.options[2].innerHTML == "Option 2a"
assert select.options[3].value == "3"
assert select.options[3].innerHTML == "Option 3"
assert select.options[4].value == ""
assert select.options[4].innerHTML == ""
def test_select_options_remove(self):
# GIVEN the existing select element with 3 options
select = page.find(f"#test_select_element_to_remove")[0]
# EXPECT the select element to have 3 options
assert len(select.options) == 4
# EXPECT the options to have the values originally set
assert select.options[0].value == "1"
assert select.options[1].value == "2"
assert select.options[2].value == "3"
assert select.options[3].value == "4"
# WHEN we remove the second option (index starts at 0)
select.options.remove(1)
# EXPECT the select element to have 2 options
assert len(select.options) == 3
# EXPECT the options to have the values originally set but the second
assert select.options[0].value == "1"
assert select.options[1].value == "3"
assert select.options[2].value == "4"
def test_select_get_selected_option(self):
# GIVEN the existing select element with one selected option
select = page.find(f"#test_select_element_w_options")[0]
# WHEN we get the selected option
selected_option = select.options.selected
# EXPECT the selected option to be correct
assert selected_option.value == "2"
assert selected_option.innerHTML == "Option 2"
assert selected_option.selected == selected_option._dom_element.selected == True