"Try by yourself" editor

[snehabhandge]

What are you trying to achieve?

Trying to utilize different concepts, methods with different selectors but sometimes get stuck with some problems.
This is a suggestion to provide "Try by yourself" editor for corresponding examples. This will not only help the existing users but also will feel easy, comfortable to new joiners.

What do you get instead?

Provide console output if related. Use --verbose mode for more details.

# paste output here

Provide test source code if related

// paste test

Details

• CodeceptJS version:
• NodeJS Version:
• Operating System:
• puppeteer || webdriverio || testcafe version (if related)
• Configuration file:

# paste config here

[DavertMik]

@snehabhandge could you expand more the idea, how it should be? Should it be from a website or inside the CodeceptUI app?

[snehabhandge]

We can start with website and we can restrict to website, if anybody wants this feature he/she must check it on website in case merging it with app is going to take time.
It can be something like... for example we we have any method like below

We can provide "Try by yourself on the title with an icon or at the last with a link... and that should have plain html with element of particular selector only on left side once we run it, it should show the changes on right side.... something like this I was thinking of.. or collectively also we can provide this feature for related methods..

[DavertMik]

The idea is really good but I don't know/don't have a time to implement it
If CodeceptJS was frontend library it would be easy to have this
But as it requires at least Playwright it is hard to make such demo with a limited resources

Anyway, let's keep this idea as maybe someone would like to implement this thing