Puth's playground

What is this page?

This page is used for the internal Puth tests and offers the possibility to test all functions of Puth. You can check this page if you have difficulties with a function or to try out a function.

Start with Puth

How to get started with Puth you can read on puth.io

Get started Supported languages

Querying

$ (php: get)

$div = $this->page->get('#querying-get');

Div with id querying-get

$$ (php: getAll)

$divs = $this->page->getAll('.querying-get');

foreach ($divs as $div) {
    echo $div->getProperty('textContent')->jsonValue();
}

Div with class querying-get

contains

$divs = $this->page->contains('apple');

Text containing apple

Properties

.value()

$inputValue = $this->page->get('#properties-value input')->value();
$textareaValue = $this->page->get('#properties-value textarea')->value();
$selectValue = $this->page->get('#properties-value select')->value();

.innerText()

$divInnerText = $this->page->get('#properties-innertext')->innerText();

div with this innertext

.innerHTML()

$divInnerHtml = $this->page->get('#properties-innerhtml')->innerHTML();

child div

with this innerhtml

Attributes

$dataTest = $page->get('#properties-attributes')->its('data-test');

div with data and aria attribute

Dialog

dialog

// Alert
$this->page->click('#dialog-alert');
$dialog = $this->page->waitForDialog(); // waits for a dialog to open
$dialog->dismiss();

// Prompt
$this->page->click('#dialog-prompt');
$dialog = $this->page->waitForDialog();
$dialog->accept('type this text into the prompt');
// or $dialog->dismiss();

// Confirm
$this->page->click('#dialog-confirm');
$dialog = $this->page->waitForDialog();
$dialog->accept();
// or $dialog->dismiss();

Prompt text:

confirm value:

Actions

type

$this->page->get('input')->type('write your text');

focus/blur

$this->page->get('#actions-focus')->focus();

// or with selector
$this->page->focus('#actions-focus');

// And to blur
$this->page->get('#actions-focus')->blur();

// or with selector
$this->page->blur('#actions-focus');

input with id actions-focus

clear

$this->page->get('input')->clear();

click & doubleClick & middleClick & rightClick

$this->page->get('button')->click();

select

$this->page->get('select')->select('Apple');

checkbox

// TOD

action-checkbox

action-radio-apple action-radio-orange

scrollIntoView

$this->page->get('select')->scrollIntoView();

Div with id actions-scrollIntoView

scrollTo

$this->page->scrollTo(0, 200);

$this->page->get('#actions-scrollTo')->scrollTo(0, 100);

Div with id actions-scrollIntoView

Should see this div after scroll y 100

hover

// TOD

Traversal

children

$parent = $this->page->get('#traversal-parent');

// returns all 3 children
$children = $parent->children();

// returns only the children that match the selector
$selected = $parent->children('.traversal-child-selector');

Div with id traversal-parent

Child 1

Child 2 (with class traversal-child-selector)

Child 3 (with class traversal-child-selector)

parent & parents

$child = $this->page->get('#traversal-child');

// returns the wrapper div
$parent = $child->parent();

// returns all parent elements until html
$parents = $child->parents();

Wrapper div

Div with id traversal-child

siblings

// returns 'Child 1' and 'Child 3'
$siblings = $this->page->get('#traversal-siblings')->siblings();

Child 1

Child 2 (with id traversal-siblings)

Child 3

Drag & Drop

Drop element on target

$parent = $this->page->get('#traversal-parent');

// returns all 3 children
$children = $parent->children();

// returns only the children that match the selector
$selected = $parent->children('.traversal-child-selector');

Drag this

into here

Wait for

waitForMissing(Text)

// TODO

click button to hide this element

waitForEvent

// TODO

File

waitForMissing(Text)

// TODO

File content preview:

iFrame

withinFrame

// TODO