├── .changeset ├── README.md ├── changelog-github-custom.cjs ├── changelog-github-custom.ts └── config.json ├── .gitattributes ├── .github ├── ISSUE_TEMPLATE │ ├── bug.yaml │ ├── docs_suggestion.yml │ └── feature.yaml ├── PULL_REQUEST_TEMPLATE.md └── workflows │ ├── ci.yml │ ├── linter.yml │ ├── pr.yml │ └── release.yml ├── .gitignore ├── .nvmrc ├── .prettierignore ├── CHANGELOG.md ├── CODE_OF_CONDUCT.md ├── CONTRIBUTING.md ├── LICENSE ├── README.md ├── bin └── partytown.cjs ├── docs ├── .eslintignore ├── .eslintrc.cjs ├── .gitignore ├── .prettierignore ├── .prettierrc.js ├── .vscode │ ├── launch.json │ ├── qwik-router.code-snippets │ └── qwik.code-snippets ├── README.md ├── adapters │ └── cloudflare-pages │ │ └── vite.config.mts ├── package.json ├── pnpm-lock.yaml ├── postcss.config.cjs ├── public │ ├── 196x196.png │ ├── 256x256.png │ ├── 32x32.png │ ├── _headers │ ├── _redirects │ ├── favicon.ico │ ├── favicon.svg │ ├── install-partytown-shopify.gif │ ├── manifest.json │ ├── open-dev-settings.gif │ ├── partytown-logo.svg │ ├── partytown-media.png │ ├── partytown.svg │ ├── reinstall-partytown.png │ └── robots.txt ├── qwik.env.d.ts ├── recma-provide-components.ts ├── src │ ├── components │ │ ├── Aside │ │ │ └── Aside.tsx │ │ ├── CodeSnippet │ │ │ └── CodeSnippet.tsx │ │ ├── Footer │ │ │ └── Footer.tsx │ │ ├── Header │ │ │ └── Header.tsx │ │ ├── Highlight │ │ │ └── Highlight.tsx │ │ ├── Icons │ │ │ ├── CloseIcon.tsx │ │ │ ├── GitHubIcon.tsx │ │ │ ├── MenuIcon.tsx │ │ │ ├── ThemeDarkIcon.tsx │ │ │ └── ThemeLightIcon.tsx │ │ ├── MdxComponents │ │ │ └── MdxComponents.tsx │ │ ├── RouterHead │ │ │ └── RouterHead.tsx │ │ ├── ThemeSelector │ │ │ └── ThemeSelector.tsx │ │ └── Toc │ │ │ └── Toc.tsx │ ├── config.ts │ ├── entry.cloudflare-pages.tsx │ ├── entry.dev.tsx │ ├── entry.preview.tsx │ ├── entry.ssr.tsx │ ├── global.scss │ ├── root.tsx │ ├── routes │ │ ├── 404.tsx │ │ ├── angular │ │ │ └── index.mdx │ │ ├── astro │ │ │ └── index.mdx │ │ ├── atomics │ │ │ └── index.mdx │ │ ├── browser-support │ │ │ └── index.mdx │ │ ├── common-services │ │ │ └── index.mdx │ │ ├── configuration │ │ │ └── index.mdx │ │ ├── copy-library-files │ │ │ └── index.mdx │ │ ├── cross-origin │ │ │ └── index.ts │ │ ├── debugging │ │ │ └── index.mdx │ │ ├── distribution │ │ │ └── index.mdx │ │ ├── facebook-pixel │ │ │ └── index.mdx │ │ ├── faq │ │ │ └── index.mdx │ │ ├── forwarding-events │ │ │ └── index.mdx │ │ ├── gatsby │ │ │ └── index.mdx │ │ ├── getting-started │ │ │ └── index.mdx │ │ ├── google-tag-manager │ │ │ └── index.mdx │ │ ├── how-does-partytown-work │ │ │ └── index.mdx │ │ ├── html │ │ │ └── index.mdx │ │ ├── index.mdx │ │ ├── integrations │ │ │ └── index.mdx │ │ ├── layout.tsx │ │ ├── magento2 │ │ │ └── index.mdx │ │ ├── menu.md │ │ ├── nextjs │ │ │ └── index.mdx │ │ ├── nuxt │ │ │ └── index.mdx │ │ ├── partytown-scripts │ │ │ └── index.mdx │ │ ├── proxying-requests │ │ │ └── index.mdx │ │ ├── react │ │ │ └── index.mdx │ │ ├── remix │ │ │ └── index.mdx │ │ ├── sandboxing │ │ │ └── index.mdx │ │ ├── service-worker.ts │ │ ├── shopify-hydrogen │ │ │ └── index.mdx │ │ ├── shopify-os2 │ │ │ └── index.mdx │ │ ├── solid │ │ │ └── index.mdx │ │ ├── sveltekit │ │ │ └── index.mdx │ │ └── trade-offs │ │ │ └── index.mdx │ ├── state │ │ └── MDXProvider.tsx │ ├── types.ts │ └── utils │ │ └── cn.ts ├── tailwind.config.js ├── tsconfig.json └── vite.config.mts ├── package.json ├── playwright.atomics.config.ts ├── playwright.config.ts ├── pnpm-lock.yaml ├── scripts ├── build-api.ts ├── build-atomics.ts ├── build-integration.ts ├── build-main-snippet.ts ├── build-media-implementations.ts ├── build-react.ts ├── build-service-worker.ts ├── build-services.ts ├── build-utils.ts ├── build-web-worker.ts ├── index.ts ├── minify.ts ├── rollup.config.js ├── serve.cjs ├── server.cjs └── utils.ts ├── src ├── integration │ ├── api-extractor.json │ ├── api.md │ ├── index.ts │ ├── package.json │ └── snippet.ts ├── lib │ ├── atomics │ │ ├── sync-create-messenger-atomics.ts │ │ └── sync-send-message-to-main-atomics.ts │ ├── build-modules │ │ ├── sync-create-messenger.ts │ │ ├── sync-send-message-to-main.ts │ │ ├── version.ts │ │ ├── web-worker-blob.ts │ │ └── web-worker-url.ts │ ├── log.ts │ ├── main │ │ ├── snippet-entry.ts │ │ └── snippet.ts │ ├── sandbox │ │ ├── index.ts │ │ ├── main-access-handler.ts │ │ ├── main-constants.ts │ │ ├── main-custom-element.ts │ │ ├── main-forward-trigger.ts │ │ ├── main-globals.ts │ │ ├── main-instances.ts │ │ ├── main-register-window.ts │ │ ├── main-serialization.ts │ │ ├── on-messenge-from-worker.ts │ │ ├── read-main-platform.ts │ │ └── read-main-scripts.ts │ ├── service-worker │ │ ├── fetch.ts │ │ ├── index.ts │ │ ├── sync-create-messenger-sw.ts │ │ └── sync-send-message-to-main-sw.ts │ ├── types.ts │ ├── utils.ts │ └── web-worker │ │ ├── index.ts │ │ ├── init-web-worker.ts │ │ ├── media │ │ ├── bridge.ts │ │ ├── canvas.ts │ │ ├── index.ts │ │ ├── media.ts │ │ └── utils.ts │ │ ├── worker-anchor.ts │ │ ├── worker-constants.ts │ │ ├── worker-constructors.ts │ │ ├── worker-css-style-declaration.ts │ │ ├── worker-custom-elements.ts │ │ ├── worker-document.ts │ │ ├── worker-element.ts │ │ ├── worker-environment.ts │ │ ├── worker-exec.ts │ │ ├── worker-form.ts │ │ ├── worker-forwarded-trigger.ts │ │ ├── worker-iframe.ts │ │ ├── worker-image.ts │ │ ├── worker-location.ts │ │ ├── worker-media.ts │ │ ├── worker-named-node-map.ts │ │ ├── worker-navigator.ts │ │ ├── worker-node.ts │ │ ├── worker-performance.ts │ │ ├── worker-proxy.ts │ │ ├── worker-script.ts │ │ ├── worker-serialization.ts │ │ ├── worker-src-element.ts │ │ ├── worker-state.ts │ │ ├── worker-storage.ts │ │ ├── worker-style.ts │ │ ├── worker-svg.ts │ │ └── worker-window.ts ├── modules.d.ts ├── react │ ├── api-extractor.json │ ├── api.md │ ├── index.ts │ ├── package.json │ └── snippet.tsx ├── services │ ├── api-extractor.json │ ├── api.md │ ├── facebook-pixel.ts │ ├── freshpaint.ts │ ├── google-tag-manager.ts │ ├── index.ts │ └── package.json └── utils │ ├── api-extractor.json │ ├── api.md │ ├── copy-lib-files.ts │ ├── fs.ts │ ├── index.ts │ ├── package.json │ ├── rollup.ts │ └── vite.ts ├── tests ├── 404.html ├── atomics │ └── index.html ├── benchmarks │ ├── benchmark.js │ ├── index.html │ ├── run.cjs │ └── services │ │ └── index.html ├── index.html ├── integrations │ ├── clarity │ │ ├── clarity.bundle.js │ │ ├── clarity.spec.ts │ │ ├── index.html │ │ └── standard.html │ ├── config │ │ ├── config.spec.ts │ │ └── index.html │ ├── event-forwarding │ │ ├── event-forwarding.spec.ts │ │ └── index.html │ ├── facebook-pixel │ │ ├── facebook-pixel.spec.ts │ │ ├── index.html │ │ └── standard.html │ ├── full-story │ │ ├── full-story.spec.ts │ │ ├── index.html │ │ └── standard.html │ ├── gtm │ │ ├── gtag.js │ │ ├── gtm.js │ │ ├── gtm.spec.ts │ │ ├── index.html │ │ ├── preserve-behavior.html │ │ └── standard.html │ ├── hubspot │ │ ├── 20632911.js │ │ ├── analytics-20632911.js │ │ ├── banner-20632911.js │ │ ├── collectedforms.js │ │ ├── forms-standard.html │ │ ├── forms.html │ │ ├── hubspot.spec.ts │ │ ├── leadflows.js │ │ ├── scripts-20632911.js │ │ └── shell.js │ ├── intercom │ │ ├── app-modern.e4d2d085.js │ │ ├── frame-modern.5069da72.js │ │ ├── index.html │ │ ├── shim.latest.js │ │ ├── standard.html │ │ ├── submit.3abafccd.mp3 │ │ ├── vendor-modern.d054d6ff.js │ │ └── vendors~app-modern.c7bfd661.js │ ├── javascript-request │ │ ├── execute.js │ │ ├── index.html │ │ ├── javascript-request.spec.ts │ │ └── some-text.txt │ ├── jquery │ │ ├── index.html │ │ ├── jquery.js │ │ ├── jquery.spec.ts │ │ └── standard.html │ ├── kiwisizing │ │ ├── index.html │ │ ├── kiwisizing.SizingPlugin.js │ │ ├── kiwisizing.spec.ts │ │ ├── shopify-dynamic-checkout.js │ │ └── standard.html │ ├── load-scripts-on-main-thread │ │ ├── background-test-script.js │ │ ├── index.html │ │ ├── load-scripts-on-main-thread.spec.ts │ │ ├── regex-test-script.js │ │ ├── snippet.html │ │ ├── test-script.js │ │ └── wait-for-class.js │ ├── main-window-accessors │ │ ├── index.html │ │ └── main-window-accessors.spec.ts │ ├── mermaid │ │ ├── index.html │ │ ├── mermaid.js │ │ ├── mermaid.spec.ts │ │ └── standard.html │ ├── twitter │ │ ├── index.html │ │ ├── standard.html │ │ ├── twitter.spec.ts │ │ └── widgets.js │ ├── underoutfit │ │ ├── index.html │ │ └── standard.html │ ├── underoutfit_kiwi │ │ ├── index.html │ │ ├── kiwisizing.SizingPlugin.js │ │ └── standard.html │ └── wistia │ │ ├── E-v1.js │ │ ├── assets │ │ └── external │ │ │ ├── airplay.js │ │ │ ├── engines │ │ │ ├── hls_video.js │ │ │ ├── manual_quality_video.js │ │ │ └── native_hls_video.js │ │ │ ├── playPauseLoadingControl.js │ │ │ ├── vulcanV2Player │ │ │ └── video │ │ │ │ ├── controls │ │ │ │ └── VolumeSliderControl │ │ │ │ │ └── VolumeSliderControl.js │ │ │ │ └── ui_components │ │ │ │ └── Storyboard.js │ │ │ └── wistia-mux.js │ │ ├── embed │ │ └── medias │ │ │ └── varrf62cw4.json │ │ ├── index.html │ │ ├── standard.html │ │ └── varrf62cw4.jsonp ├── nextjs │ ├── README.md │ ├── next.config.js │ ├── nextjs.spec.ts │ ├── package.json │ ├── pages │ │ ├── _app.js │ │ └── index.js │ └── playwright.nextjs.ts ├── platform │ ├── anchor │ │ ├── anchor.spec.ts │ │ └── index.html │ ├── audio │ │ ├── audio-scripts.js │ │ ├── audio.spec.ts │ │ ├── index.html │ │ └── submit.mp3 │ ├── canvas │ │ ├── canvas.spec.ts │ │ └── index.html │ ├── custom-element │ │ ├── custom-element.spec.ts │ │ └── index.html │ ├── document-prod │ │ ├── current-script-src.js │ │ ├── document-prod.spec.ts │ │ └── index.html │ ├── document │ │ ├── current-script-src.js │ │ ├── document.spec.ts │ │ └── index.html │ ├── element-class │ │ ├── element-class.spec.ts │ │ └── index.html │ ├── element-style │ │ ├── element-style.spec.ts │ │ └── index.html │ ├── element │ │ ├── element.spec.ts │ │ └── index.html │ ├── error │ │ ├── error.spec.ts │ │ └── index.html │ ├── event │ │ ├── event.spec.ts │ │ └── index.html │ ├── fetch │ │ ├── data.json │ │ ├── fetch.spec.ts │ │ ├── index.html │ │ └── text.txt │ ├── form │ │ ├── form.spec.ts │ │ └── index.html │ ├── history │ │ ├── history.spec.ts │ │ ├── iframe-history.html │ │ └── index.html │ ├── iframe │ │ ├── call-fn-on-parent.js │ │ ├── content.html │ │ ├── cookie.html │ │ ├── current-script.js │ │ ├── external-js.html │ │ ├── external.js │ │ ├── fn-on-window.js │ │ ├── global-var.html │ │ ├── iframe-cookie-localstorage.spec.ts │ │ ├── iframe1.spec.ts │ │ ├── iframe2.spec.ts │ │ ├── index-cookie-localstorage.html │ │ ├── index.html │ │ ├── index2.html │ │ ├── localstorage.html │ │ ├── location1.html │ │ ├── location2.html │ │ ├── location2.js │ │ ├── no-deadlock.html │ │ ├── no-deadlock.js │ │ ├── no-global-share.html │ │ ├── no-global-share.js │ │ ├── onload.js │ │ ├── parent-window.js │ │ ├── post-message.html │ │ ├── src-change1.html │ │ └── src-change2.html │ ├── image │ │ ├── dot.gif │ │ ├── image.spec.ts │ │ └── index.html │ ├── intersection-observer │ │ ├── index.html │ │ └── intersection-observer.spec.ts │ ├── klaviyo │ │ ├── current-script-src.js │ │ ├── document.spec.ts │ │ └── index.html │ ├── multiple-tabs │ │ ├── index.html │ │ └── multiple-tabs.spec.ts │ ├── mutation-observer │ │ ├── index.html │ │ └── mutation-observer.spec.ts │ ├── navigator │ │ ├── api.js │ │ ├── index.html │ │ └── navigator.spec.ts │ ├── no-partytown-script │ │ ├── index.html │ │ └── no-partytown-script.spec.ts │ ├── node-list │ │ ├── index.html │ │ └── node-list.spec.ts │ ├── node │ │ ├── index.html │ │ └── node.spec.ts │ ├── resize-observer │ │ ├── index.html │ │ └── resize-observer.spec.ts │ ├── screen │ │ ├── index.html │ │ └── screen.spec.ts │ ├── script │ │ ├── async-1.js │ │ ├── async-2.js │ │ ├── defer-1.js │ │ ├── defer-2.js │ │ ├── index.html │ │ ├── jsonp-a.js │ │ ├── jsonp-b.js │ │ ├── jsonp-c.js │ │ ├── script-1.js │ │ ├── script.spec.ts │ │ ├── set-get-attr.js │ │ └── source-mapping-url.js │ ├── storage │ │ ├── index.html │ │ ├── storage-access.html │ │ ├── storage-access.spec.ts │ │ └── storage.spec.ts │ ├── style │ │ ├── index.html │ │ └── style.spec.ts │ ├── svg │ │ ├── index.html │ │ └── svg.spec.ts │ ├── video │ │ ├── index.html │ │ └── video.spec.__ts │ └── window │ │ ├── index.html │ │ └── window.spec.ts ├── react-app │ ├── package.json │ ├── public │ │ └── index.html │ ├── src │ │ ├── App.css │ │ ├── App.tsx │ │ ├── index.css │ │ ├── index.tsx │ │ ├── logo.svg │ │ └── react-app-env.d.ts │ └── tsconfig.json └── unit │ ├── forward.spec.ts │ ├── html-replace.spec.ts │ ├── integration.spec.ts │ ├── snippet.spec.ts │ ├── utils.spec.ts │ ├── utils.ts │ └── worker-exec.spec.ts └── tsconfig.json /.changeset/README.md: -------------------------------------------------------------------------------- 1 | # Changesets 2 | 3 | Hello and welcome! This folder has been automatically generated by `@changesets/cli`, a build tool that works 4 | with multi-package repos, or single-package repos to help you version and publish your code. You can 5 | find the full documentation for it [in our repository](https://github.com/changesets/changesets) 6 | 7 | We have a quick list of common questions to get you started engaging with this project in 8 | [our documentation](https://github.com/changesets/changesets/blob/main/docs/common-questions.md) 9 | -------------------------------------------------------------------------------- /.changeset/config.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "https://unpkg.com/@changesets/config@3.0.4/schema.json", 3 | "changelog": ["./changelog-github-custom.cjs", { "repo": "QwikDev/partytown" }], 4 | "commit": false, 5 | "fixed": [], 6 | "linked": [], 7 | "access": "public", 8 | "baseBranch": "main", 9 | "updateInternalDependencies": "patch", 10 | "ignore": [] 11 | } 12 | -------------------------------------------------------------------------------- /.gitattributes: -------------------------------------------------------------------------------- 1 | tests/** linguist-vendored 2 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/bug.yaml: -------------------------------------------------------------------------------- 1 | name: 🐞 Bug Report 2 | description: Something does not work or is flaky! Let us know! 3 | labels: [bug, triage] 4 | title: '[🐞]' 5 | body: 6 | - type: markdown 7 | attributes: 8 | value: | 9 | Thanks for taking the time to fill out this bug report! 10 | 11 | - type: textarea 12 | id: description 13 | attributes: 14 | description: 'A clear and concise description of what you expected to happen instead. If you intend to submit a PR for this issue, tell us in the description. Thanks!' 15 | label: Describe the bug 16 | placeholder: I am doing ... What I expect is ... What actually happening is ... 17 | validations: 18 | required: true 19 | 20 | - type: input 21 | id: reproduction 22 | attributes: 23 | label: Reproduction 24 | description: Please provide a link to a repo that can reproduce the problem you ran into. Please see the [contributing docs](https://github.com/BuilderIO/partytown/blob/main/CODE_OF_CONDUCT.md) for suggestions on create a reproduction. A [minimal reproduction](https://stackoverflow.com/help/minimal-reproducible-example) is required ([Why?](https://antfu.me/posts/why-reproductions-are-required)). If a report is vague (e.g. just a generic error message) and has no reproduction, it will receive a "need reproduction" label. If no reproduction is provided after 3 days, it will be auto-closed. 25 | placeholder: Reproduction URL 26 | validations: 27 | required: true 28 | 29 | - type: textarea 30 | id: reproduction_steps 31 | attributes: 32 | label: Steps to reproduce 33 | description: Please provide any reproduction steps that may need to be described. 34 | validations: 35 | required: true 36 | 37 | - type: input 38 | id: browser_info 39 | attributes: 40 | label: Browser Info 41 | description: Which browser did you experience the issue on? 42 | placeholder: Chrome, Safari, Firefox, Edge 43 | validations: 44 | required: true 45 | 46 | - type: textarea 47 | id: additional_information 48 | attributes: 49 | label: Additional Information 50 | validations: 51 | required: false 52 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/docs_suggestion.yml: -------------------------------------------------------------------------------- 1 | name: 📖 Documentation Suggestion 2 | description: Suggestions on how we can improve the documentation. 3 | title: '[📖]' 4 | labels: [documentation] 5 | body: 6 | - type: markdown 7 | attributes: 8 | value: | 9 | Thanks for taking the time to fill out docs suggestion! However, if you think it's something you can fix yourself, please submit a PR instead. In every doc page, you will be able to find the "Edit this page" in the right menu! 10 | 11 | - type: textarea 12 | id: description 13 | attributes: 14 | description: 'A clear and concise description of your suggestion to improve the docs.' 15 | label: Suggestion 16 | validations: 17 | required: true 18 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/feature.yaml: -------------------------------------------------------------------------------- 1 | name: ✨ Feature Request 2 | description: Suggest an idea for this project. 3 | labels: [enhancement, triage] 4 | title: '[✨]' 5 | body: 6 | - type: textarea 7 | id: use_case 8 | attributes: 9 | label: 'Is your feature request related to a problem?' 10 | description: 'A clear and concise description of what the problem is.' 11 | validations: 12 | required: true 13 | 14 | - type: textarea 15 | id: solution 16 | attributes: 17 | label: "Describe the solution you'd like" 18 | description: 'A clear and concise description of what you want to happen.' 19 | validations: 20 | required: true 21 | 22 | - type: textarea 23 | id: alternatives 24 | attributes: 25 | label: "Describe alternatives you've considered" 26 | description: "A clear and concise description of any alternative solutions or features you've considered." 27 | validations: 28 | required: true 29 | 30 | - type: textarea 31 | id: additional_context 32 | attributes: 33 | label: 'Additional context' 34 | description: 'Add any other context or screenshots about the feature request here.' 35 | validations: 36 | required: false 37 | -------------------------------------------------------------------------------- /.github/PULL_REQUEST_TEMPLATE.md: -------------------------------------------------------------------------------- 1 | # What is it? 2 | 3 | - [ ] Feature / enhancement 4 | - [ ] Bug 5 | - [ ] Docs / tests 6 | 7 | # Description 8 | 9 | Please include a summary of the change and which issue is fixed. Please also include relevant motivation and context. List any dependencies that are required for this change. 10 | 11 | # Use cases and why 12 | 13 | 14 | 15 | - 1. One use case 16 | - 2. Another use case 17 | 18 | # Checklist: 19 | 20 | - [ ] My code follows the [developer guidelines of this project](https://github.com/BuilderIO/partytown/blob/main/CONTRIBUTING.md) 21 | - [ ] I have performed a self-review of my own code 22 | - [ ] I have made corresponding changes to the documentation 23 | - [ ] Added new tests to cover the fix / functionality 24 | -------------------------------------------------------------------------------- /.github/workflows/linter.yml: -------------------------------------------------------------------------------- 1 | name: PR Prettier Check 2 | 3 | on: 4 | pull_request_target: 5 | types: 6 | - opened 7 | - edited 8 | - synchronize 9 | - ready_for_review 10 | 11 | permissions: 12 | pull-requests: read 13 | 14 | jobs: 15 | ########### LINT PACKAGE ############ 16 | lint-package: 17 | name: Lint Package 18 | runs-on: ubuntu-latest 19 | steps: 20 | - name: Checkout 21 | uses: actions/checkout@v4.1.1 22 | 23 | - uses: pnpm/action-setup@v4.0.0 24 | 25 | - name: Setup Node 26 | uses: actions/setup-node@v4.0.2 27 | with: 28 | node-version: 20.10.0 29 | cache: 'pnpm' 30 | registry-url: https://registry.npmjs.org/ 31 | 32 | - run: corepack enable 33 | 34 | - name: Install NPM Dependencies 35 | run: pnpm install --frozen-lockfile 36 | 37 | - name: Prettier Check 38 | if: ${{ always() }} 39 | run: pnpm fmt.check 40 | -------------------------------------------------------------------------------- /.github/workflows/pr.yml: -------------------------------------------------------------------------------- 1 | name: PR Title Check 2 | 3 | on: 4 | pull_request_target: 5 | types: 6 | - opened 7 | - edited 8 | - synchronize 9 | - ready_for_review 10 | 11 | permissions: 12 | pull-requests: read 13 | 14 | jobs: 15 | ############ SEMANTIC PR TITLE VALIDATION ############ 16 | semantic-pr: 17 | name: Validate PR title 18 | runs-on: ubuntu-latest 19 | steps: 20 | - uses: amannn/action-semantic-pull-request@v5 21 | env: 22 | GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} 23 | -------------------------------------------------------------------------------- /.github/workflows/release.yml: -------------------------------------------------------------------------------- 1 | name: Release 2 | 3 | on: 4 | pull_request: 5 | push: 6 | branches: 7 | - main 8 | 9 | jobs: 10 | release: 11 | runs-on: ubuntu-latest 12 | 13 | if: github.ref == 'refs/heads/main' 14 | 15 | steps: 16 | - name: Checkout all commits 17 | uses: actions/checkout@v3 18 | with: 19 | fetch-depth: 0 20 | 21 | - name: Setup git user 22 | shell: bash 23 | run: | 24 | git config --global user.name '@partytown' 25 | git config --global user.email 'partytown@users.noreply.github.com' 26 | 27 | - name: Setup pnpm 28 | uses: pnpm/action-setup@v4 29 | with: 30 | version: 9.7.0 31 | 32 | - name: Use Node 33 | uses: actions/setup-node@v4 34 | with: 35 | node-version: 20.x 36 | registry-url: https://registry.npmjs.org 37 | cache: 'pnpm' 38 | 39 | - name: Install dependencies 40 | shell: bash 41 | run: pnpm install --frozen-lockfile 42 | 43 | - name: Build packages 44 | shell: bash 45 | run: pnpm build.prod 46 | 47 | # - name: Publish any commit / build for testing 48 | # run: pnpm release.pkg-pr-new 49 | # env: 50 | # GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} 51 | 52 | - name: Create Release Pull Request or Publish 53 | if: github.ref == 'refs/heads/main' 54 | id: changesets 55 | uses: changesets/action@v1 56 | with: 57 | publish: pnpm release 58 | env: 59 | NPM_TOKEN: ${{ secrets.NPM_TOKEN }} 60 | NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }} 61 | GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} 62 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | .cache/ 2 | .next/ 3 | .DS_Store 4 | /dist/ 5 | /docs/site/dist/ 6 | /docs/site/public/~partytown/ 7 | /docs/site/src/table-of-contents.ts 8 | /docs/site/src/pages/ 9 | node_modules/ 10 | /integration/ 11 | /lib/ 12 | /react/ 13 | /tests/nextjs/public/ 14 | /tests/benchmarks/screenshots/ 15 | /tests/posts/ 16 | /tests/react-app/public/~partytown/ 17 | /tests/videos/ 18 | /services/ 19 | /tsc/ 20 | /utils/ 21 | /index.cjs 22 | /index.mjs 23 | /index.d.ts 24 | .idea 25 | .history 26 | tests/integrations/load-scripts-on-main-thread/snippet.js 27 | -------------------------------------------------------------------------------- /.nvmrc: -------------------------------------------------------------------------------- 1 | 20.10.0 -------------------------------------------------------------------------------- /.prettierignore: -------------------------------------------------------------------------------- 1 | .cache 2 | /lib 3 | /node_modules 4 | /react 5 | /tsc 6 | api.md 7 | tests/platform/script/source-mapping-url.js -------------------------------------------------------------------------------- /CHANGELOG.md: -------------------------------------------------------------------------------- 1 | # @qwik.dev/partytown 2 | 3 | ## 0.11.1 4 | 5 | ### Patch Changes 6 | 7 | - Add adoptedStyleSheets.get() to patched `document` in worker. (by [@leeroybrun](https://github.com/leeroybrun) in [#674](https://github.com/QwikDev/partytown/pull/674)) 8 | 9 | ## 0.11.0 10 | 11 | ### Minor Changes 12 | 13 | - Bunch of fixes and a new release system.. (by [@shairez](https://github.com/shairez) in [#652](https://github.com/QwikDev/partytown/pull/652)) 14 | 15 | **Here's a list of the changes:** 16 | 17 | ### FEATURES 18 | 19 | - add config fallback timeout (#620) 20 | 21 | ### FIXES 22 | 23 | - Same-origin iframe set/get cookie/localStorage bug (#600) 24 | - make sure unknown is mapped to HTMLUnknownElement cstr (#606) 25 | 26 | ### DOCS 27 | 28 | - making install commands consistent (#638) 29 | - Add example reverse proxy handler for Facebook Pixel (#648) 30 | - add integration module for Magento 2 (#594) 31 | - add clarification that the worker strategy is not supported with app directory (#625) 32 | - use dummy web property ID (#621) 33 | - revert recent incorrect change to SvelteKit destination (#622) 34 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2021 Builder.io 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /bin/partytown.cjs: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env node 2 | 3 | async function run() { 4 | const task = process.argv.slice(2).filter((a) => !a.startsWith('-'))[0]; 5 | const args = process.argv.slice(2).filter((a) => a !== task); 6 | 7 | if (task === 'help' || args.includes('--help') || args.includes('-h')) { 8 | help(); 9 | } else if (task === 'version' || args.includes('--version') || args.includes('-v')) { 10 | console.log(version()); 11 | } else if (task === 'copylib') { 12 | await copyLibTask(args); 13 | } else { 14 | panic('Unknown partytown task: ' + task); 15 | } 16 | } 17 | 18 | async function copyLibTask(args) { 19 | try { 20 | const utils = require('../utils/index.cjs'); 21 | const destDir = args.filter((a) => !a.startsWith('-'))[0]; 22 | const logResult = !args.includes('--silent'); 23 | const includeDebugDir = !args.includes('--no-debug'); 24 | const result = await utils.copyLibFiles(destDir, { 25 | debugDir: includeDebugDir, 26 | }); 27 | 28 | if (logResult) { 29 | console.log('Partytown lib copied to: ' + result.dest); 30 | } 31 | } catch (e) { 32 | panic(String(e.message || e)); 33 | } 34 | } 35 | 36 | function help() { 37 | console.log(``); 38 | console.log(`Partytown (${version()}):`); 39 | console.log(``); 40 | console.log(` copylib [--no-debug | --silent]`); 41 | console.log(``); 42 | } 43 | 44 | function version() { 45 | return require('../package.json').version; 46 | } 47 | 48 | function panic(msg) { 49 | console.error('\n❌ ' + msg); 50 | help(); 51 | process.exit(1); 52 | } 53 | 54 | run(); 55 | -------------------------------------------------------------------------------- /docs/.eslintignore: -------------------------------------------------------------------------------- 1 | **/*.log 2 | **/.DS_Store 3 | *. 4 | .vscode/settings.json 5 | .history 6 | .yarn 7 | bazel-* 8 | bazel-bin 9 | bazel-out 10 | bazel-qwik 11 | bazel-testlogs 12 | dist 13 | dist-dev 14 | lib 15 | lib-types 16 | etc 17 | external 18 | node_modules 19 | temp 20 | tsc-out 21 | tsdoc-metadata.json 22 | target 23 | output 24 | rollup.config.js 25 | build 26 | .cache 27 | .vscode 28 | .rollup.cache 29 | dist 30 | tsconfig.tsbuildinfo 31 | vite.config.mts 32 | *.spec.tsx 33 | *.spec.ts 34 | .netlify 35 | pnpm-lock.yaml 36 | package-lock.json 37 | yarn.lock 38 | server 39 | -------------------------------------------------------------------------------- /docs/.eslintrc.cjs: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | root: true, 3 | env: { 4 | browser: true, 5 | es2021: true, 6 | node: true, 7 | }, 8 | extends: [ 9 | "eslint:recommended", 10 | "plugin:@typescript-eslint/recommended", 11 | "plugin:qwik/recommended", 12 | ], 13 | parser: "@typescript-eslint/parser", 14 | parserOptions: { 15 | tsconfigRootDir: __dirname, 16 | project: ["./tsconfig.json"], 17 | ecmaVersion: 2021, 18 | sourceType: "module", 19 | ecmaFeatures: { 20 | jsx: true, 21 | }, 22 | }, 23 | plugins: ["@typescript-eslint"], 24 | rules: { 25 | "@typescript-eslint/no-explicit-any": "off", 26 | "@typescript-eslint/explicit-module-boundary-types": "off", 27 | "@typescript-eslint/no-inferrable-types": "off", 28 | "@typescript-eslint/no-non-null-assertion": "off", 29 | "@typescript-eslint/no-empty-interface": "off", 30 | "@typescript-eslint/no-namespace": "off", 31 | "@typescript-eslint/no-empty-function": "off", 32 | "@typescript-eslint/no-this-alias": "off", 33 | "@typescript-eslint/ban-types": "off", 34 | "@typescript-eslint/ban-ts-comment": "off", 35 | "prefer-spread": "off", 36 | "no-case-declarations": "off", 37 | "no-console": "off", 38 | "@typescript-eslint/no-unused-vars": ["error"], 39 | "@typescript-eslint/consistent-type-imports": "warn", 40 | "@typescript-eslint/no-unnecessary-condition": "warn", 41 | }, 42 | }; 43 | -------------------------------------------------------------------------------- /docs/.gitignore: -------------------------------------------------------------------------------- 1 | # Build 2 | /dist 3 | /lib 4 | /lib-types 5 | /server 6 | 7 | # Development 8 | node_modules 9 | .env 10 | *.local 11 | 12 | # Cache 13 | .cache 14 | .mf 15 | .rollup.cache 16 | tsconfig.tsbuildinfo 17 | 18 | # Logs 19 | logs 20 | *.log 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | pnpm-debug.log* 25 | lerna-debug.log* 26 | 27 | # Editor 28 | .vscode/* 29 | !.vscode/launch.json 30 | !.vscode/*.code-snippets 31 | 32 | .idea 33 | .DS_Store 34 | *.suo 35 | *.ntvs* 36 | *.njsproj 37 | *.sln 38 | *.sw? 39 | 40 | # Yarn 41 | .yarn/* 42 | !.yarn/releases 43 | 44 | # Cloudflare 45 | functions/**/*.js 46 | -------------------------------------------------------------------------------- /docs/.prettierignore: -------------------------------------------------------------------------------- 1 | **/*.log 2 | **/.DS_Store 3 | *. 4 | .vscode/settings.json 5 | .history 6 | .yarn 7 | bazel-* 8 | bazel-bin 9 | bazel-out 10 | bazel-qwik 11 | bazel-testlogs 12 | dist 13 | dist-dev 14 | lib 15 | lib-types 16 | etc 17 | external 18 | node_modules 19 | temp 20 | tsc-out 21 | tsdoc-metadata.json 22 | target 23 | output 24 | rollup.config.js 25 | build 26 | .cache 27 | .vscode 28 | .rollup.cache 29 | tsconfig.tsbuildinfo 30 | vite.config.mts 31 | *.spec.tsx 32 | *.spec.ts 33 | .netlify 34 | pnpm-lock.yaml 35 | package-lock.json 36 | yarn.lock 37 | server 38 | -------------------------------------------------------------------------------- /docs/.prettierrc.js: -------------------------------------------------------------------------------- 1 | export default { 2 | plugins: ["prettier-plugin-tailwindcss"], 3 | }; 4 | -------------------------------------------------------------------------------- /docs/.vscode/launch.json: -------------------------------------------------------------------------------- 1 | { 2 | // Use IntelliSense to learn about possible attributes. 3 | // Hover to view descriptions of existing attributes. 4 | // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387 5 | "version": "0.2.0", 6 | "configurations": [ 7 | { 8 | "name": "Launch Chrome", 9 | "request": "launch", 10 | "type": "chrome", 11 | "url": "http://localhost:5173", 12 | "webRoot": "${workspaceFolder}" 13 | }, 14 | { 15 | "type": "node", 16 | "name": "dev.debug", 17 | "request": "launch", 18 | "skipFiles": ["/**"], 19 | "cwd": "${workspaceFolder}", 20 | "program": "${workspaceFolder}/node_modules/vite/bin/vite.js", 21 | "args": ["--mode", "ssr", "--force"] 22 | } 23 | ] 24 | } 25 | -------------------------------------------------------------------------------- /docs/.vscode/qwik-router.code-snippets: -------------------------------------------------------------------------------- 1 | { 2 | "onRequest": { 3 | "scope": "javascriptreact,typescriptreact", 4 | "prefix": "qonRequest", 5 | "description": "onRequest function for a route index", 6 | "body": [ 7 | "export const onRequest: RequestHandler = (request) => {", 8 | " $0", 9 | "};", 10 | ], 11 | }, 12 | "loader$": { 13 | "scope": "javascriptreact,typescriptreact", 14 | "prefix": "qloader$", 15 | "description": "loader$()", 16 | "body": ["export const $1 = routeLoader$(() => {", " $0", "});"], 17 | }, 18 | "action$": { 19 | "scope": "javascriptreact,typescriptreact", 20 | "prefix": "qaction$", 21 | "description": "action$()", 22 | "body": ["export const $1 = routeAction$((data) => {", " $0", "});"], 23 | }, 24 | "Full Page": { 25 | "scope": "javascriptreact,typescriptreact", 26 | "prefix": "qpage", 27 | "description": "Simple page component", 28 | "body": [ 29 | "import { component$ } from '@qwik.dev/core';", 30 | "", 31 | "export default component$(() => {", 32 | " $0", 33 | "});", 34 | ], 35 | }, 36 | } 37 | -------------------------------------------------------------------------------- /docs/adapters/cloudflare-pages/vite.config.mts: -------------------------------------------------------------------------------- 1 | import { cloudflarePagesAdapter } from "@qwik.dev/router/adapters/cloudflare-pages/vite"; 2 | import { extendConfig } from "@qwik.dev/router/vite"; 3 | import baseConfig from "../../vite.config.mts"; 4 | 5 | export default extendConfig(baseConfig, () => { 6 | return { 7 | build: { 8 | ssr: true, 9 | rollupOptions: { 10 | input: ["src/entry.cloudflare-pages.tsx", "@qwik-router-config"], 11 | }, 12 | }, 13 | plugins: [ 14 | cloudflarePagesAdapter({ 15 | ssg: { 16 | include: ["/*"], 17 | origin: "https://partytown.qwik.dev", 18 | }, 19 | }), 20 | ], 21 | }; 22 | }); 23 | -------------------------------------------------------------------------------- /docs/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "my-qwik-empty-starter", 3 | "description": "Blank project with routing included", 4 | "engines": { 5 | "node": "^18.17.0 || ^20.3.0 || >=21.0.0" 6 | }, 7 | "engines-annotation": "Mostly required by sharp which needs a Node-API v9 compatible runtime", 8 | "private": true, 9 | "trustedDependencies": [ 10 | "sharp" 11 | ], 12 | "trustedDependencies-annotation": "Needed for bun to allow running install scripts", 13 | "type": "module", 14 | "scripts": { 15 | "build": "qwik build", 16 | "build.client": "vite build", 17 | "build.preview": "vite build --ssr src/entry.preview.tsx", 18 | "build.server": "vite build -c adapters/cloudflare-pages/vite.config.mts", 19 | "build.types": "tsc --incremental --noEmit", 20 | "deploy": "wrangler pages deploy ./dist", 21 | "dev": "vite --mode ssr", 22 | "dev.debug": "node --inspect-brk ./node_modules/vite/bin/vite.js --mode ssr --force", 23 | "fmt": "prettier --write .", 24 | "fmt.check": "prettier --check .", 25 | "lint": "eslint \"src/**/*.ts*\"", 26 | "preview": "qwik build preview && vite preview --open", 27 | "serve": "wrangler pages dev ./dist --compatibility-flags=nodejs_als", 28 | "start": "vite --open --mode ssr", 29 | "qwik": "qwik" 30 | }, 31 | "devDependencies": { 32 | "@qwik.dev/core": "^2.0.0-alpha.4", 33 | "@qwik.dev/router": "^2.0.0-alpha.4", 34 | "@types/eslint": "8.56.10", 35 | "@types/node": "20.14.11", 36 | "@typescript-eslint/eslint-plugin": "7.16.1", 37 | "@typescript-eslint/parser": "7.16.1", 38 | "autoprefixer": "^10.4.19", 39 | "clsx": "^2.1.1", 40 | "eslint": "8.57.0", 41 | "eslint-plugin-qwik": "^2.0.0-alpha.4", 42 | "postcss": "^8.4.39", 43 | "prettier": "3.3.3", 44 | "prettier-plugin-tailwindcss": "^0.5.4", 45 | "rehype-pretty-code": "^0.14.0", 46 | "sass": "^1.83.0", 47 | "shiki": "^1.24.3", 48 | "tailwind-merge": "^2.5.5", 49 | "tailwindcss": "^3.4.6", 50 | "typescript": "5.4.5", 51 | "unist-util-visit": "^5.0.0", 52 | "vite": "5.4.10", 53 | "vite-tsconfig-paths": "^4.2.1", 54 | "wrangler": "^3.0.0" 55 | } 56 | } 57 | -------------------------------------------------------------------------------- /docs/postcss.config.cjs: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | plugins: { 3 | tailwindcss: {}, 4 | autoprefixer: {}, 5 | }, 6 | }; 7 | -------------------------------------------------------------------------------- /docs/public/196x196.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/QwikDev/partytown/326a31b5c4d86b02db62f234cd518bab904d828f/docs/public/196x196.png -------------------------------------------------------------------------------- /docs/public/256x256.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/QwikDev/partytown/326a31b5c4d86b02db62f234cd518bab904d828f/docs/public/256x256.png -------------------------------------------------------------------------------- /docs/public/32x32.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/QwikDev/partytown/326a31b5c4d86b02db62f234cd518bab904d828f/docs/public/32x32.png -------------------------------------------------------------------------------- /docs/public/_headers: -------------------------------------------------------------------------------- 1 | # https://developers.cloudflare.com/pages/platform/headers/ 2 | 3 | /*service-worker.js 4 | Cache-Control: no-store 5 | Content-Type: application/javascript 6 | X-Content-Type-Options: nosniff 7 | 8 | /build/* 9 | Cache-Control: public, max-age=31536000, s-maxage=31536000, immutable 10 | -------------------------------------------------------------------------------- /docs/public/_redirects: -------------------------------------------------------------------------------- 1 | # https://developers.cloudflare.com/pages/platform/redirects/ 2 | -------------------------------------------------------------------------------- /docs/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/QwikDev/partytown/326a31b5c4d86b02db62f234cd518bab904d828f/docs/public/favicon.ico -------------------------------------------------------------------------------- /docs/public/favicon.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /docs/public/install-partytown-shopify.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/QwikDev/partytown/326a31b5c4d86b02db62f234cd518bab904d828f/docs/public/install-partytown-shopify.gif -------------------------------------------------------------------------------- /docs/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "https://json.schemastore.org/web-manifest-combined.json", 3 | "name": "qwik-project-name", 4 | "short_name": "Welcome to Qwik", 5 | "start_url": ".", 6 | "display": "standalone", 7 | "background_color": "#fff", 8 | "description": "A Qwik project app." 9 | } 10 | -------------------------------------------------------------------------------- /docs/public/open-dev-settings.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/QwikDev/partytown/326a31b5c4d86b02db62f234cd518bab904d828f/docs/public/open-dev-settings.gif -------------------------------------------------------------------------------- /docs/public/partytown-media.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/QwikDev/partytown/326a31b5c4d86b02db62f234cd518bab904d828f/docs/public/partytown-media.png -------------------------------------------------------------------------------- /docs/public/reinstall-partytown.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/QwikDev/partytown/326a31b5c4d86b02db62f234cd518bab904d828f/docs/public/reinstall-partytown.png -------------------------------------------------------------------------------- /docs/public/robots.txt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/QwikDev/partytown/326a31b5c4d86b02db62f234cd518bab904d828f/docs/public/robots.txt -------------------------------------------------------------------------------- /docs/qwik.env.d.ts: -------------------------------------------------------------------------------- 1 | // This file can be used to add references for global types like `vite/client`. 2 | 3 | // Add global `vite/client` types. For more info, see: https://vitejs.dev/guide/features#client-types 4 | /// 5 | -------------------------------------------------------------------------------- /docs/src/components/Aside/Aside.tsx: -------------------------------------------------------------------------------- 1 | import { component$ } from "@qwik.dev/core"; 2 | import { useContent } from "@qwik.dev/router"; 3 | 4 | export const Aside = component$(() => { 5 | const { menu } = useContent(); 6 | 7 | return ( 8 |
11 | {(menu?.items || []).map(({ text, items }, idx) => { 12 | const [title, href] = text.split("|"); 13 | return ( 14 | 41 | ); 42 | })} 43 |
44 | ); 45 | }); 46 | -------------------------------------------------------------------------------- /docs/src/components/CodeSnippet/CodeSnippet.tsx: -------------------------------------------------------------------------------- 1 | import type { PropsOf } from "@qwik.dev/core"; 2 | import { component$, useSignal, useTask$ } from "@qwik.dev/core"; 3 | import { useLocation } from "@qwik.dev/router"; 4 | import { isDev } from "@qwik.dev/core/build"; 5 | import { Highlight } from "../Highlight/Highlight"; 6 | 7 | // The below `/src/routes/docs/**/**/snippets/*.tsx` pattern is here so that import.meta.glob works both for styled and headless routes. 8 | // For example: 9 | // /src/routes/docs/components/styled/modal/snippets/building-blocks.tsx 10 | // /src/routes/docs/components/headless/modal/snippets/building-blocks.tsx 11 | 12 | // eslint-disable-next-line @typescript-eslint/no-explicit-any 13 | const codeSnippets: any = import.meta.glob(`/src/**/snippets/*`, { 14 | query: "?raw", 15 | eager: isDev ? false : true, 16 | }); 17 | 18 | type CodeSnippetProps = PropsOf<"div"> & { 19 | name: string; 20 | }; 21 | 22 | export const CodeSnippet = component$(({ name }) => { 23 | const location = useLocation(); 24 | 25 | // Determine the file extension if not specified 26 | const fileExtension = 27 | name.endsWith(".tsx") || name.endsWith(".ts") || name.endsWith(".css") 28 | ? "" 29 | : ".tsx"; 30 | const snippetPath = `/src/routes${location.url.pathname}snippets/${name}${fileExtension}`; 31 | 32 | const codeSnippetSig = useSignal(); 33 | 34 | useTask$(async () => { 35 | const code = isDev 36 | ? await codeSnippets[snippetPath]() // We need to call `await codeSnippets[snippetPath]()` in development as it is `eager:false` 37 | : codeSnippets[snippetPath]; // We need to directly access the `codeSnippets[snippetPath]` expression in preview/production as it is `eager:true` 38 | codeSnippetSig.value = code.default; 39 | }); 40 | 41 | return ( 42 |
43 | 44 |
45 | ); 46 | }); 47 | -------------------------------------------------------------------------------- /docs/src/components/Footer/Footer.tsx: -------------------------------------------------------------------------------- 1 | import { component$ } from "@qwik.dev/core"; 2 | import { GitHubIcon } from "../Icons/GitHubIcon"; 3 | 4 | export const Footer = component$(() => { 5 | return ( 6 | 23 | ); 24 | }); 25 | -------------------------------------------------------------------------------- /docs/src/components/Icons/CloseIcon.tsx: -------------------------------------------------------------------------------- 1 | import { component$ } from "@qwik.dev/core"; 2 | 3 | export const CloseIcon = component$(() => { 4 | return ( 5 | 13 | 18 | 19 | ); 20 | }); 21 | -------------------------------------------------------------------------------- /docs/src/components/Icons/GitHubIcon.tsx: -------------------------------------------------------------------------------- 1 | import { component$ } from "@qwik.dev/core"; 2 | 3 | export const GitHubIcon = component$<{ classes?: string }>( 4 | ({ classes = "w-8 h8" }) => { 5 | return ( 6 | 19 | ); 20 | }, 21 | ); 22 | -------------------------------------------------------------------------------- /docs/src/components/Icons/MenuIcon.tsx: -------------------------------------------------------------------------------- 1 | import { component$ } from "@qwik.dev/core"; 2 | 3 | export const MenuIcon = component$(() => { 4 | return ( 5 | 12 | 13 | 14 | 18 | 19 | 20 | ); 21 | }); 22 | -------------------------------------------------------------------------------- /docs/src/components/Icons/ThemeDarkIcon.tsx: -------------------------------------------------------------------------------- 1 | import { component$ } from "@qwik.dev/core"; 2 | 3 | export const ThemeDarkIcon = component$(() => { 4 | return ( 5 | 18 | ); 19 | }); 20 | -------------------------------------------------------------------------------- /docs/src/components/Icons/ThemeLightIcon.tsx: -------------------------------------------------------------------------------- 1 | import { component$ } from "@qwik.dev/core"; 2 | 3 | export const ThemeLightIcon = component$(() => { 4 | return ( 5 | 18 | ); 19 | }); 20 | -------------------------------------------------------------------------------- /docs/src/components/MdxComponents/MdxComponents.tsx: -------------------------------------------------------------------------------- 1 | import type { QwikIntrinsicElements } from "@qwik.dev/core"; 2 | import { Slot, component$ } from "@qwik.dev/core"; 3 | import { CodeSnippet } from "../CodeSnippet/CodeSnippet"; 4 | 5 | export const components: Record = { 6 | pre: component$( 7 | () => { 8 | return ( 9 |
10 | 
11 |             
12 |
13 |
14 | ); 15 | }, 16 | ), 17 | code: component$(({ ...props }) => { 18 | return ( 19 | 20 | 21 | 22 | ); 23 | }), 24 | CodeSnippet, 25 | }; 26 | -------------------------------------------------------------------------------- /docs/src/components/ThemeSelector/ThemeSelector.tsx: -------------------------------------------------------------------------------- 1 | import { component$, useContext } from "@qwik.dev/core"; 2 | import { ThemeDarkIcon } from "~/components/Icons/ThemeDarkIcon"; 3 | import { ThemeLightIcon } from "~/components/Icons/ThemeLightIcon"; 4 | import { StoreContext } from "~/routes/layout"; 5 | 6 | export const ThemeSelector = component$(() => { 7 | const store = useContext(StoreContext); 8 | return ( 9 |
{ 12 | store.theme = store.theme === "light" ? "dark" : "light"; 13 | const newTheme = store.theme === "light" ? "light" : "dark"; 14 | document.documentElement.className = newTheme; 15 | localStorage.setItem("theme", store.theme); 16 | }} 17 | > 18 |
19 | 20 |
21 |
22 | 23 |
24 |
25 | ); 26 | }); 27 | -------------------------------------------------------------------------------- /docs/src/config.ts: -------------------------------------------------------------------------------- 1 | export const config = { 2 | title: "PartyTown", 3 | GitHub: "https://github.com/QwikDev/partytown", 4 | }; 5 | -------------------------------------------------------------------------------- /docs/src/entry.cloudflare-pages.tsx: -------------------------------------------------------------------------------- 1 | /* 2 | * WHAT IS THIS FILE? 3 | * 4 | * It's the entry point for Cloudflare Pages when building for production. 5 | * 6 | * Learn more about the Cloudflare Pages integration here: 7 | * - https://qwik.dev/docs/deployments/cloudflare-pages/ 8 | * 9 | */ 10 | import { manifest } from "@qwik-client-manifest"; 11 | import qwikRouterConfig from "@qwik-router-config"; 12 | import { 13 | createQwikRouter, 14 | type PlatformCloudflarePages, 15 | } from "@qwik.dev/router/middleware/cloudflare-pages"; 16 | import render from "./entry.ssr"; 17 | 18 | declare global { 19 | interface QwikRouterPlatform extends PlatformCloudflarePages {} 20 | } 21 | 22 | const fetch = createQwikRouter({ render, qwikRouterConfig, manifest }); 23 | 24 | export { fetch }; 25 | -------------------------------------------------------------------------------- /docs/src/entry.dev.tsx: -------------------------------------------------------------------------------- 1 | /* 2 | * WHAT IS THIS FILE? 3 | * 4 | * Development entry point using only client-side modules: 5 | * - Do not use this mode in production! 6 | * - No SSR 7 | * - No portion of the application is pre-rendered on the server. 8 | * - All of the application is running eagerly in the browser. 9 | * - More code is transferred to the browser than in SSR mode. 10 | * - Optimizer/Serialization/Deserialization code is not exercised! 11 | */ 12 | import { render, type RenderOptions } from "@qwik.dev/core"; 13 | import Root from "./root"; 14 | 15 | export default function (opts: RenderOptions) { 16 | return render(document, , opts); 17 | } 18 | -------------------------------------------------------------------------------- /docs/src/entry.preview.tsx: -------------------------------------------------------------------------------- 1 | /* 2 | * WHAT IS THIS FILE? 3 | * 4 | * It's the bundle entry point for `npm run preview`. 5 | * That is, serving your app built in production mode. 6 | * 7 | * Feel free to modify this file, but don't remove it! 8 | * 9 | * Learn more about Vite's preview command: 10 | * - https://vitejs.dev/config/preview-options.html#preview-options 11 | * 12 | */ 13 | import qwikRouterConfig from "@qwik-router-config"; 14 | import { createQwikRouter } from "@qwik.dev/router/middleware/node"; 15 | // make sure qwikRouterConfig is imported before entry 16 | import render from "./entry.ssr"; 17 | 18 | /** 19 | * The default export is the QwikRouter adapter used by Vite preview. 20 | */ 21 | export default createQwikRouter({ render, qwikRouterConfig }); 22 | -------------------------------------------------------------------------------- /docs/src/entry.ssr.tsx: -------------------------------------------------------------------------------- 1 | /** 2 | * WHAT IS THIS FILE? 3 | * 4 | * SSR entry point, in all cases the application is rendered outside the browser, this 5 | * entry point will be the common one. 6 | * 7 | * - Server (express, cloudflare...) 8 | * - npm run start 9 | * - npm run preview 10 | * - npm run build 11 | * 12 | */ 13 | import { manifest } from "@qwik-client-manifest"; 14 | import { 15 | renderToStream, 16 | type RenderToStreamOptions, 17 | } from "@qwik.dev/core/server"; 18 | import Root from "./root"; 19 | 20 | export default function (opts: RenderToStreamOptions) { 21 | return renderToStream(, { 22 | manifest, 23 | ...opts, 24 | // Use container attributes to set attributes on the html tag. 25 | containerAttributes: { 26 | lang: "en-us", 27 | ...opts.containerAttributes, 28 | }, 29 | serverData: { 30 | ...opts.serverData, 31 | }, 32 | }); 33 | } 34 | -------------------------------------------------------------------------------- /docs/src/root.tsx: -------------------------------------------------------------------------------- 1 | import { component$, isDev } from "@qwik.dev/core"; 2 | import { 3 | QwikRouterProvider, 4 | RouterOutlet, 5 | ServiceWorkerRegister, 6 | } from "@qwik.dev/router"; 7 | 8 | import "./global.scss"; 9 | import { RouterHead } from "./components/RouterHead/RouterHead"; 10 | 11 | export default component$(() => { 12 | /** 13 | * The root of a QwikRouter site always start with the component, 14 | * immediately followed by the document's and . 15 | * 16 | * Don't remove the `` and `` elements. 17 | */ 18 | 19 | return ( 20 | 21 | 22 | 23 | {!isDev && ( 24 | 28 | )} 29 | 30 | 31 | 32 | 33 | {!isDev && } 34 | 35 | 36 | ); 37 | }); 38 | -------------------------------------------------------------------------------- /docs/src/routes/404.tsx: -------------------------------------------------------------------------------- 1 | import { component$ } from "@qwik.dev/core"; 2 | 3 | export default component$(() => { 4 | return ( 5 | <> 6 |

Page Not Found

7 |

We could not find what you were looking for.

8 |

9 | Please contact the owner of the site that linked you to the original URL 10 | and let them know their link is broken. 11 |

12 | 13 | ); 14 | }); 15 | -------------------------------------------------------------------------------- /docs/src/routes/angular/index.mdx: -------------------------------------------------------------------------------- 1 | --- 2 | title: Angular 3 | --- 4 | 5 | # Angular 6 | 7 | To setup Partytown in an Angular project take the following steps. 8 | 9 | ## Installation 10 | 11 | Run the command below to install the dependencies 12 | 13 | ```bash 14 | npm install @qwik.dev/partytown 15 | yarn add @qwik.dev/partytown 16 | pnpm install @qwik.dev/partytown 17 | ``` 18 | 19 | Add the path to the Partytown JS files into the assets array in your `angular.json` file 20 | 21 | ```json 22 | "projects": { 23 | ... 24 | "{project-name}": { 25 | ... 26 | "architect": { 27 | ... 28 | "build": { 29 | ... 30 | "options": { 31 | "assets": [..., 32 | { 33 | "glob": "**/*", 34 | "input": "node_modules/@qwik.dev/partytown/lib", 35 | "output": "/~partytown" 36 | } 37 | ] 38 | } 39 | } 40 | } 41 | } 42 | } 43 | ``` 44 | 45 | ## Script Setup 46 | 47 | The snippet below shows you how to setup Partytown scripts in your `index.html` file. The first script tag takes the Partytown [configuration](/configuration). The second script tag references the Partytown JS file and the third file takes the third-party scripts to be loaded on the web-worker. 48 | 49 | ```html 50 | 51 | /* Partytown config properties */ 52 | 57 | 58 | /* Inlined Partytown Snippet */ 59 | 60 | 61 | 64 | 65 | ``` 66 | -------------------------------------------------------------------------------- /docs/src/routes/astro/index.mdx: -------------------------------------------------------------------------------- 1 | --- 2 | title: Astro 3 | --- 4 | 5 | # Astro 6 | 7 | There is a first-class [Astro integration for partytown](https://github.com/withastro/astro/tree/main/packages/integrations/partytown). 8 | 9 | ## Automatic Setup 10 | 11 | Astro includes a CLI tool for adding integrations. Using the `astro add` command will automatically install Partytown and configure your project. 12 | 13 | ```bash 14 | npx astro add partytown 15 | yarn astro add partytown 16 | pnpx astro add partytown 17 | ``` 18 | 19 | ## Partytown Script 20 | 21 | Add `type: 'text/partytown'` [attribute](/partytown-scripts) to any scripts you want to be handled by Partytown. 22 | 23 | ```html 24 | 25 | ``` 26 | 27 | Note that the [Astro Partytown](https://github.com/withastro/astro/tree/main/packages/integrations/partytown) integration already handles copying the library files to the correct location. 28 | -------------------------------------------------------------------------------- /docs/src/routes/browser-support/index.mdx: -------------------------------------------------------------------------------- 1 | --- 2 | title: Browser Support 3 | --- 4 | 5 | # Browser Support 6 | 7 | Partytown works to ensure that all browsers can still run third-party scripts, whether they have support for service workers, atomics, or neither. This means if you're supporting legacy browsers such as IE11, the scripts should continue to work as if Partytown wasn't being used. 8 | 9 | At its core, Partytown uses Service Workers or Atomics to do its synchronous communication from the web worker to the main thread. However, when a browser does not support either of those, it'll fallback to run the scripts the traditional way (the way it works today without Partytown). 10 | 11 | ## How Feature Support Works 12 | 13 | 1. Browser checks to see if it has support for [Atomics](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Atomics) using the [crossOriginIsolated](https://developer.mozilla.org/en-US/docs/Web/API/crossOriginIsolated) boolean found on `window`. 14 | 1. If the browser and site do not have support for Atomics, it'll then check to see if the browser has support for [Service Workers](https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API). Currently this is the most commonly used one. 15 | 1. If the browser does not have support for Service Workers or Atomics, it'll then find all the `type="text/partytown"` scripts and reset them to be traditional scripts and execute normally. 16 | 17 | > Note: Atomics are still experimental, and also require specific server-side response headers for them to work. Please see the [Enabling Atomics](/atomics) section for more info. 18 | 19 | ## Web API Feature Support 20 | 21 | - [Atomics](https://caniuse.com/mdn-javascript_builtins_atomics) 22 | - [JavaScript Proxy](https://caniuse.com/proxy) 23 | - [Service Workers](https://caniuse.com/serviceworkers) 24 | - [Web Workers](https://caniuse.com/webworkers) 25 | -------------------------------------------------------------------------------- /docs/src/routes/cross-origin/index.ts: -------------------------------------------------------------------------------- 1 | import { RequestHandler } from "@qwik.dev/router"; 2 | 3 | export const onGet: RequestHandler = async ({send}) => { 4 | const page = ` 5 | 6 | 7 | 13 | 14 | 15 |
16 | iframe origin: 17 | 18 |
19 |
20 | parent origin: 21 | 22 |
23 | 43 | 44 | `; 45 | send(200, page); 46 | }; -------------------------------------------------------------------------------- /docs/src/routes/debugging/index.mdx: -------------------------------------------------------------------------------- 1 | --- 2 | title: Debugging 3 | --- 4 | 5 | # Debugging 6 | 7 | With `debug` mode and logging enabled, below is an example of the Partytown logs showing all calls, getters and setters: 8 | 9 | ![Partytown Debug Console Logs](https://user-images.githubusercontent.com/452425/131688576-e207cb15-7ce5-4009-a358-3e3093d51957.png) 10 | 11 | The [debug config](/configuration) must be `true` in order to see more verbose logging messages. The config table below lists all of the possible log configurations. 12 | 13 | If you are using Chrome DevTools to see these logs, make sure that the `Verbose` log level is selected in Console 14 | 15 | | Log Config Property | Description | 16 | | ----------------------- | ----------------------------------- | 17 | | `logCalls` | Log method calls | 18 | | `logGetters` | Log getter calls | 19 | | `logSetters` | Log setter calls | 20 | | `logImageRequests` | Log Image() src requests | 21 | | `logScriptExecution` | Log script executions | 22 | | `logSendBeaconRequests` | Log navigator.sendBeacon() requests | 23 | | `logStackTraces` | Log stack traces | 24 | 25 | Please see the [debug file docs](/distribution#libdebug) more information about the distribution. 26 | -------------------------------------------------------------------------------- /docs/src/routes/getting-started/index.mdx: -------------------------------------------------------------------------------- 1 | --- 2 | title: Getting Started 3 | --- 4 | 5 | # Getting Started 6 | 7 | Partytown is fairly different from most web development libraries in mainly what’s required for its setup and configuration. At the lowest level, Partytown can work with just vanilla HTML, meaning it doesn’t need to be a part of a build process, doesn’t need a bundler, doesn’t require a specific framework, etc. Because it can integrate with any HTML page, it also makes it much easier to then create wrapper components or plugins for almost any ecosystem, such as Shopify, WordPress, Nextjs, Gatsby and much more. 8 | 9 | What's different from most web development libraries is that Partytown does _not_ get bundled with your existing site's JavaScript. Instead it purposely wants to stay separate from your code so that it can run within a web worker, and allow your code to run on the main thread. If the two were bundled we've already lost the battle. 10 | 11 | ## Install NPM package 12 | 13 | ``` 14 | npm install @qwik.dev/partytown 15 | ``` 16 | 17 | ## Next Steps 18 | 19 | 1. [Add Partytown type attribute to Third-Party Scripts](/partytown-scripts) 20 | 2. [Add Partytown snippet to the ``](/integrations) 21 | 3. [Copy Partytown library files](/copy-library-files) 22 | -------------------------------------------------------------------------------- /docs/src/routes/google-tag-manager/index.mdx: -------------------------------------------------------------------------------- 1 | --- 2 | title: Google Tag Manager 3 | --- 4 | 5 | # Google Tag Manager 6 | 7 | ## Add the Google Tag Manager Script 8 | 9 | - [Install Google Tag Manager for web pages](https://developers.google.com/tag-platform/tag-manager/web) 10 | 11 | ## Partytown Script 12 | 13 | Set the script element's `type` attribute to `text/partytown`. For example: 14 | 15 | ```html 16 | 20 | 27 | ``` 28 | 29 | ## Google Analytics 4 (GA4) 30 | 31 | GA4 responses come with the correct CORS headers, so you will not have to [proxy](/proxying-requests) the requests to `www.google-analytics.com`. [Older versions of Google Analytics](https://support.google.com/analytics/answer/11583528?sjid=5512098847312629397-NA) required proxying, but have been sunset by Google and are no longer supported. 32 | 33 | ## Forward Events 34 | 35 | Google Tag Manager uses the [dataLayer](https://developers.google.com/tag-platform/tag-manager/web/datalayer) array to send events. In order for Partytown to forward the calls to `window.dataLayer.push({..})`, the forward config should add `"dataLayer.push"`. Please see [forwarding events and triggers](/forwarding-events) for more information. 36 | 37 | ## Example Config 38 | 39 | ```json 40 | { 41 | "forward": ["dataLayer.push"] 42 | } 43 | ``` 44 | 45 | Please see the [integration docs](/integrations) for framework specific configuration. 46 | -------------------------------------------------------------------------------- /docs/src/routes/integrations/index.mdx: -------------------------------------------------------------------------------- 1 | --- 2 | title: Integration Guides 3 | --- 4 | 5 | # Integration Guides 6 | 7 | Partytown can work with any HTML page, and doesn't require a specific framework. However, to make it easier to use in various frameworks or services, plugins/wrappers can be made for their ecosystem. Below is a current list of integrations. Please help us add more! 8 | 9 | - [Angular](/angular) 10 | - [Astro](/astro) 11 | - [Gatsby](/gatsby) 12 | - [HTML](/html) 13 | - [NextJS](/nextjs) 14 | - [Nuxt](/nuxt) 15 | - [Qwik](https://qwik.builder.io/docs/integrations/partytown/) 16 | - [React](/react) 17 | - [Remix](/remix) 18 | - [Shopify Hydrogen](/shopify-hydrogen) 19 | - [Solid](/solid) 20 | - [SvelteKit](/sveltekit) 21 | 22 | See something missing and would like to contribute? Please [open an issue](https://github.com/BuilderIO/partytown/issues/new/choose) and we'd love to work with you to get your integration up and running and listed here. It may be as simple as just writing a doc, similar to the ones above, detailing how to best implement Partytown in the framework or service. 23 | -------------------------------------------------------------------------------- /docs/src/routes/menu.md: -------------------------------------------------------------------------------- 1 | # Docs Table Of Contents 2 | 3 | ## Introduction|/ 4 | 5 | - [How Does It Work?](/how-does-partytown-work) 6 | - [FAQs](/faq) 7 | - [Trade-Offs](/trade-offs) 8 | - [Browser Support](/browser-support) 9 | 10 | ## Getting Started|/getting-started 11 | 12 | - [Overview](/getting-started) 13 | - [Partytown Scripts](/partytown-scripts) 14 | - [Copy Library Files](/copy-library-files) 15 | - [Atomics](/atomics) 16 | - [Distribution](/distribution) 17 | 18 | ## Integrations|/integrations 19 | 20 | - [Angular](/angular) 21 | - [Astro](/astro) 22 | - [Gatsby](/gatsby) 23 | - [HTML](/html) 24 | - [Magento 2](/magento2) 25 | - [Next.js](/nextjs) 26 | - [Nuxt](/nuxt) 27 | - [Qwik](https://qwik.dev/docs/integrations/partytown/) 28 | - [React](/react) 29 | - [Remix](/remix) 30 | - [Shopify Hydrogen](/shopify-hydrogen) 31 | - [Shopify OS 2.0](/shopify-os2) 32 | - [Solid](/solid) 33 | - [SvelteKit](/sveltekit) 34 | 35 | ## Configuration|/configuration 36 | 37 | - [Overview](/configuration) 38 | - [Proxying Requests](/proxying-requests) 39 | - [Forwarding Events](/forwarding-events) 40 | - [Sandboxing](/sandboxing) 41 | - [Debugging](/debugging) 42 | 43 | ## Third-Party Services|/common-services 44 | 45 | - [Common Services](/common-services) 46 | - [Facebook Pixel](/facebook-pixel) 47 | - [Google Tag Manager](/google-tag-manager) 48 | 49 | ## Community 50 | 51 | - [Discord](https://discord.gg/aHKdpdWv7a) 52 | - [@QwikDev](https://twitter.com/QwikDev) 53 | -------------------------------------------------------------------------------- /docs/src/routes/nuxt/index.mdx: -------------------------------------------------------------------------------- 1 | --- 2 | title: Nuxt 3 | --- 4 | 5 | # Nuxt 6 | 7 | There is a first-class [Nuxt integration for partytown](https://github.com/nuxt-community/partytown-module). 8 | 9 | ## Install 10 | 11 | Add `@nuxtjs/partytown` dependency to your project. 12 | 13 | ```bash 14 | npm install --save-dev @nuxtjs/partytown 15 | yarn add --dev @nuxtjs/partytown 16 | pnpm install --save-dev @nuxtjs/partytown 17 | ``` 18 | 19 | ## Configure 20 | 21 | Add `@nuxtjs/partytown` to the `modules` section of `nuxt.config.ts`. Use the `partytown` property for the [configuration](/configuration). 22 | 23 | ```js 24 | import { defineNuxtConfig } from "nuxt"; 25 | 26 | export default defineNuxtConfig({ 27 | modules: ["@nuxtjs/partytown"], 28 | partytown: { 29 | /* any partytown-specific configuration */ 30 | }, 31 | }); 32 | ``` 33 | 34 | ## Partytown Script 35 | 36 | Add `type: 'text/partytown'` [attribute](/partytown-scripts) to any scripts you want to be handled by partytown. 37 | 38 | ```html 39 |