Skip to content

Resurrect the Toga-web backend using Pyscript#1475

Merged
mhsmith merged 36 commits into
beeware:mainfrom
freakboy3742:pyscript
Oct 11, 2022
Merged

Resurrect the Toga-web backend using Pyscript#1475
mhsmith merged 36 commits into
beeware:mainfrom
freakboy3742:pyscript

Conversation

@freakboy3742

@freakboy3742 freakboy3742 commented May 1, 2022

Copy link
Copy Markdown
Member

PyScript was announced at PyCon 2022. This provides an easy-to-deploy Python in the browser.

This doesn't implement every widget, but it's enough to get Tutorial 0 and 1 (hello world and the F2C calculator) going, plus the first few stages of the BeeWare tutorial (up until the point httpx is imported); and the general approach being used should be broadly compatible with other widgets.

It pairs well with beeware/briefcase#898 as a means of deploying apps using this backend.

PR Checklist:

  • All new features have been tested
  • All new features have been documented
  • I have read the CONTRIBUTING.md file
  • I will abide by the code of conduct

@aeroaks

aeroaks commented Jun 14, 2022

Copy link
Copy Markdown

Hi, Is there a plan to move forward (resurrect) with toga-web? I saw the examples in pyscript but did not see roadmap or discussion.

@freakboy3742

Copy link
Copy Markdown
Member Author

@aeroaks Yes - the web backend is on our todo list; however, in terms of priorities, it's a little lower than solidifying the desktop and mobile platforms. In terms of roadmaps, I wouldn't expect to see big changes from the Toga side unless someone contributes them.

@aeroaks

aeroaks commented Jun 15, 2022

Copy link
Copy Markdown

In a way it would work out for me, as I can spend a limited time in contribution. I was thinking of picking up small tasks to e.g., make the tutorials in the Toga documentation work (in a similar way as the tutorials added in the pyscript repo). But for that I would need some alignment how and where to begin.

@freakboy3742 freakboy3742 marked this pull request as ready for review October 6, 2022 05:43
@freakboy3742 freakboy3742 requested a review from mhsmith October 6, 2022 05:44

@mhsmith mhsmith left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I tested using the temperature conversion app and everything worked correctly, except as noted below.

Comment thread src/core/toga/style/pack.py Outdated
Comment thread src/web/toga_web/widgets/base.py Outdated

return width, height

def __css__(self):

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm curious about the rationale for putting this here rather than in the web backend. Is it because we eventually intend to define the Pack algorithm in terms of CSS (#1544), so it makes sense for both realizations of the algorithm to be in the same file so they can be kept consistent?

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Essentially yes, but I'd phrase it a slightly different way. It's not so much about defining Pack in terms of CSS; it's more a matter of saying that a style engine can define any set of rules you want, but you have to be able to define a mapping to CSS if you want your style engine to be compatible with web deployment.

This implementation of __css__() is specific to Pack, and describes how Pack's style rules map to "pure" CSS; the implementation for Colosseum will be a 1-1 mapping of the literal style declarations. Other style engines could define complete arbitrary rules, as long as they provide an analogous CSS mapping.

The connection with #1544 is more about using CSS as a reliable known reference implementation; the Pack CSS mapping rendered in a browser should provide the same output as a Pack implementation in native widget layout.

Comment thread src/web/toga_web/app.py
Comment on lines +31 to +34
toga.Command(
None,
"Preferences",
group=toga.Group.HELP,

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Doesn't look as if this is being used anywhere.

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Correct - it's a placeholder that acts as a tease for future functionality (in the hope it will jolt someone into potentially contributing).

Comment thread src/web/toga_web/app.py Outdated
Comment thread src/web/toga_web/app.py Outdated
Comment thread src/web/toga_web/libs.py
Comment on lines +4 to +7
except ModuleNotFoundError:
# To ensure the code can be imported, provide a js symbol
# as a fallback
js = None

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

When would this happen?

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Running the test suite in CI would be the obvious case. The interface compliance tests are part of the web backend, so we need to be able to import toga_web on non-web platforms.

Comment thread src/web/toga_web/widgets/button.py Outdated
Comment thread src/web/toga_web/window.py Outdated
Comment on lines +51 to +55
[tool.briefcase.app.tutorial.web]
requires = [
'../../src/web',
]
style_framework = "Bootstrap v4.6"

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

None of these will work, because they're all called "tutorial" rather than the actual name of the app.

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🤦 I'm really firing on all cylinders at the moment...

@codecov

codecov Bot commented Oct 10, 2022

Copy link
Copy Markdown

Codecov Report

Merging #1475 (84a949a) into main (dfc7273) will decrease coverage by 12.03%.
The diff coverage is 4.76%.

Impacted Files Coverage Δ
src/core/toga/platform.py 16.66% <0.00%> (-6.87%) ⬇️
src/core/toga/style/pack.py 81.39% <5.55%> (-8.19%) ⬇️
src/core/toga/handlers.py 40.00% <0.00%> (-6.67%) ⬇️
src/core/toga/style/applicator.py 84.21% <0.00%> (-5.27%) ⬇️
src/core/toga/app.py
src/core/toga/widgets/base.py
src/dummy/toga_dummy/widgets/table.py
src/core/tests/widgets/test_selection.py
... and 116 more

@freakboy3742 freakboy3742 requested a review from mhsmith October 10, 2022 22:20
@mhsmith mhsmith merged commit f90d8e5 into beeware:main Oct 11, 2022
@freakboy3742 freakboy3742 deleted the pyscript branch October 11, 2022 22:56
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants