Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Refactor entire extension code #53

Merged
merged 31 commits into from
Oct 23, 2021
Merged

Refactor entire extension code #53

merged 31 commits into from
Oct 23, 2021

Conversation

timonla
Copy link
Contributor

@timonla timonla commented Oct 3, 2021

  • Removed a lot of dead code
  • Add typescript strict option and fix all type issues
  • Improve build scripts (now npm run watch is available to continuously build)
  • Refactor injection of additional content to use web components
  • Use npm packages instead of dist/third-party files
  • Auto generate the license information from npm packages
  • Compiled content script are now called index files (that they are content scripts is already indicated by them being compiled into the dist/content/ directory)
  • content.ts files are the files that are called on page enter
  • Add extension recommendations
    image
  • Setup CI for lint, type checking and building the extension
  • Format all code

Tested to write reusable html blocks using dom-chef to mimic react jxs style but webcomponents work much better and offer much more functionality if we need it in the future.
Injecting the webcomponents into the dom is not straight forward. Added a utility function (component) to aid this. It works fine as long as we don't want to pass any children (slot elements). I tried to enable easy injection with webcomponents and dom-chef but we loose typing on complex webcomponent properties (arrays and objects) and have to use full lowercase property names. Restricting ourselves to only passing primitive types to the webcomponent works fine, so we can fall back onto that. The experiment is available at https://github.com/flashkillapp/flashkill/tree/dom-chef-webcomponents-test.

There is a nice snippet included on how to create more webcomponents. More documentation to follow.

Resolves #42 #3 #39

@timonla timonla force-pushed the 42-extension-refactoring branch 2 times, most recently from 8fbfdbf to 3ae7e7f Compare October 7, 2021 22:24
@timonla timonla requested a review from Lyannic October 8, 2021 18:14
@timonla timonla marked this pull request as ready for review October 8, 2021 18:19
@Lyannic
Copy link
Contributor

Lyannic commented Oct 22, 2021

Is there any documentation on how to build the extension the new way?

.vscode/typescriptreact.code-snippets Outdated Show resolved Hide resolved
src/components/AdditionalPlayerInfo.ts Outdated Show resolved Hide resolved
src/components/AdditionalPlayerInfo.ts Outdated Show resolved Hide resolved
src/components/AdditionalPlayerInfo.ts Outdated Show resolved Hide resolved
src/components/AdditionalPlayerInfo.ts Outdated Show resolved Hide resolved
src/team-page/addAdditionalPlayerInfos.ts Outdated Show resolved Hide resolved
src/team-page/addAverageFaceitElo.ts Outdated Show resolved Hide resolved
src/team-page/background.ts Outdated Show resolved Hide resolved
src/team-page/background.ts Outdated Show resolved Hide resolved
src/team-page/addAdditionalPlayerInfos.ts Outdated Show resolved Hide resolved
@timonla timonla requested a review from Lyannic October 22, 2021 12:45
@timonla timonla requested a review from Lyannic October 23, 2021 11:47
src/features/team-page/background.ts Outdated Show resolved Hide resolved
@timonla timonla merged commit dd921c7 into master Oct 23, 2021
This pull request was closed.
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.

Clean up src directory
2 participants