mdn / mdn/web-components-examples

EditableList's attribute-based approach makes for a confusing example

Open
#66 2 comments 1 reaction 0 assignees View on GitHub

Nobody has claimed this yet.

needs info
Dominant language
JavaScript
Stars
3.4k
Forks
822
PR merge metrics
No merged PRs in 30d

Description

Taking list items as individual items is a pretty awkward API that people are using as an example of why web components have a bad API. It's a poor argument - you can make a similar component API in any framework - but there's no reason IMO to design a component this way. It would be far more ergonomic to take a list of items as a property, a JSON array as an attributes, and/or a list of child elements.

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Locate the EditableList web component example and inspect how it currently receives individual list items through attributes. Compare the proposed property, JSON-attribute, and child-element approaches, then establish one consistent API and update the example so its usage demonstrates the chosen design.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
frontend, web-dev
Issue type
Refactor
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
30/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.