luixaviles/litelement-website

A Single Page Application(SPA) based on Web Components using LitElement and TypeScript

LitElement Website

A Single Page Application(SPA) based on Web Components using LitElement, Vaadin Router for navigation and TypeScript.

Quickstart

To get started, install dependencies:

npm install

Start the preview of the app:

npm run start

This will open your default browser with the App.

Scripts

• start runs your app for development, reloading on file changes
• start:build runs your app after it has been built using the build command
• build builds your app and outputs it in your dist directory
• test runs your test suite with Karma
• lint runs the linter for your project

Running Cypress - E2E Testing

First, make sure you're running the application

npm run start

Then, open a separate terminal to run the E2E tests

npm run cypress:open

Or

npm run cypress:run

litelement-website's Issues

Cannot find name 'cy'

I've cloned the repo and followed the instructions, but for any command that I try to run I get an error similar to

cypress/integration/about.spec.ts(4,5): error TS2304: Cannot find name 'cy'.

missing deep-linking so page refreshes and Admin example don't work

Very nice series of articles and it's good to see that you're following the open-wc scaffolding including the web-dev-server but the example you give for an admin page won't work as there doesn't seem to be any redirections of requests going to the app entry point (index.html).

This also means that a user cannot refresh one of the application routes in the browser (i.e. a blog post) as this will result in a 404 error.

Edit:

There's been a change in the development web server from es-dev-server to @web/dev-server since you wrote this article. To get your code running with the modern open-wc scaffold you need to edit your package.json from

"start": "concurrently --kill-others --names tsc,es-dev-server \"npm run tsc:watch\" \"es-dev-server --app-index index.html --node-resolve --open --watch\"",

to

"start": "tsc && concurrently -k -r \"tsc --watch --preserveWatchOutput\" \"wds --app-index index.html\""

because the --app-index index.htm is no longer added by default.

How could fix a bug in your artilce?

Hello I am trying to use LitElement today following your article on

LitElement properties: @property vs @internalProperty

U give a demo but it does not work as your article. I try to fix a bug. but it dose not render table when click a user.

After click fresh button to reload the page, user list and table dont render.

Could u fix it adn tell why ?