├── browsers └── brave │ └── brave.md ├── .github ├── workflows │ ├── close-empty-issues.yml │ └── check-project.yml └── ISSUE_TEMPLATE │ ├── new-framework-support.yml │ ├── feature_request.md │ └── bug_report.yml ├── LICENSE ├── README.md ├── .gitignore └── repro.md /browsers/brave/brave.md: -------------------------------------------------------------------------------- 1 | Moved to https://developer.stackblitz.com/docs/platform/brave-support 2 | -------------------------------------------------------------------------------- /.github/workflows/close-empty-issues.yml: -------------------------------------------------------------------------------- 1 | on: 2 | issues: 3 | types: [opened] 4 | jobs: 5 | closeEmptyIssues: 6 | if: "${{ github.event.issue.body == '' }}" 7 | runs-on: ubuntu-latest 8 | steps: 9 | - name: close empty issues 10 | # v1.0.0 11 | uses: kerhub/saved-replies@dd3633c3608fcc768978988b012871d66f98f7d6 12 | with: 13 | token: ${{ secrets.GITHUB_TOKEN }} 14 | state: 'closed' 15 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/new-framework-support.yml: -------------------------------------------------------------------------------- 1 | name: New framework support 2 | description: Suggest a framework that we should add support for 3 | title: Framework support for [FRAMEWORK_NAME] 4 | body: 5 | - type: textarea 6 | attributes: 7 | label: Describe the solution you'd like 8 | validations: 9 | required: true 10 | - type: input 11 | attributes: 12 | label: Provide a link to a GitHub repo containing an example of the framework 13 | validations: 14 | required: true 15 | - type: textarea 16 | attributes: 17 | label: Additional context 18 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/feature_request.md: -------------------------------------------------------------------------------- 1 | --- 2 | name: Feature request 3 | about: Suggest an idea for this project 4 | title: '' 5 | labels: '' 6 | assignees: '' 7 | 8 | --- 9 | 10 | **Is your feature request related to a problem? Please describe:** 11 | 12 | 13 | **Describe the solution you'd like:** 14 | 15 | 16 | **Describe alternatives you've considered:** 17 | 18 | 19 | **Additional context:** 20 | 21 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2021 StackBlitz 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 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | WebContainers 5 | 6 | 7 | 8 | # 9 | 10 | This repository serves as a central hub for the GitHub issues and bug reports related to WebContainers for easier tracking and communication. 11 | 12 | For documentation, visit **[webcontainers.io](https://webcontainers.io)** where you'll find detailed information about WebContainers and the WebContainer API. 13 | 14 | ## Learn more 15 | 16 | - [WebContainer API docs](https://webcontainers.io/) 17 | - [Browser configuration page](https://webcontainers.io/guides/browser-config) 18 | - [Docs: Codeflow](https://developers.stackblitz.com/codeflow) 19 | - [Docs: StackBlitz classic editor](https://developer.stackblitz.com/guides/user-guide/what-is-stackblitz) 20 | - [Docs: Web Publisher](https://developer.stackblitz.com/codeflow/content-updates-with-web-publisher) 21 | 22 | ## Reach out 23 | 24 | - Chat with our team on [Discord](https://discord.gg/stackblitz) 25 | - For Enterprise inquiries, visit [Enterprise](https://webcontainers.io/enterprise) 26 | 27 | ## Changelog 28 | 29 | The changelog is made available [in our documentation](https://webcontainers.io/changelog). 30 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # Logs 2 | logs 3 | *.log 4 | npm-debug.log* 5 | yarn-debug.log* 6 | yarn-error.log* 7 | lerna-debug.log* 8 | 9 | # Diagnostic reports (https://nodejs.org/api/report.html) 10 | report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json 11 | 12 | # Runtime data 13 | pids 14 | *.pid 15 | *.seed 16 | *.pid.lock 17 | 18 | # Directory for instrumented libs generated by jscoverage/JSCover 19 | lib-cov 20 | 21 | # Coverage directory used by tools like istanbul 22 | coverage 23 | *.lcov 24 | 25 | # nyc test coverage 26 | .nyc_output 27 | 28 | # Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files) 29 | .grunt 30 | 31 | # Bower dependency directory (https://bower.io/) 32 | bower_components 33 | 34 | # node-waf configuration 35 | .lock-wscript 36 | 37 | # Compiled binary addons (https://nodejs.org/api/addons.html) 38 | build/Release 39 | 40 | # Dependency directories 41 | node_modules/ 42 | jspm_packages/ 43 | 44 | # TypeScript v1 declaration files 45 | typings/ 46 | 47 | # TypeScript cache 48 | *.tsbuildinfo 49 | 50 | # Optional npm cache directory 51 | .npm 52 | 53 | # Optional eslint cache 54 | .eslintcache 55 | 56 | # Microbundle cache 57 | .rpt2_cache/ 58 | .rts2_cache_cjs/ 59 | .rts2_cache_es/ 60 | .rts2_cache_umd/ 61 | 62 | # Optional REPL history 63 | .node_repl_history 64 | 65 | # Output of 'npm pack' 66 | *.tgz 67 | 68 | # Yarn Integrity file 69 | .yarn-integrity 70 | 71 | # dotenv environment variables file 72 | .env 73 | .env.test 74 | 75 | # parcel-bundler cache (https://parceljs.org/) 76 | .cache 77 | 78 | # Next.js build output 79 | .next 80 | 81 | # Nuxt.js build / generate output 82 | .nuxt 83 | dist 84 | 85 | # Gatsby files 86 | .cache/ 87 | # Comment in the public line in if your project uses Gatsby and *not* Next.js 88 | # https://nextjs.org/blog/next-9-1#public-directory-support 89 | # public 90 | 91 | # vuepress build output 92 | .vuepress/dist 93 | 94 | # Serverless directories 95 | .serverless/ 96 | 97 | # FuseBox cache 98 | .fusebox/ 99 | 100 | # DynamoDB Local files 101 | .dynamodb/ 102 | 103 | # TernJS port file 104 | .tern-port 105 | -------------------------------------------------------------------------------- /repro.md: -------------------------------------------------------------------------------- 1 | # Useful Bug Reports for WebContainer issues 2 | 3 | In general, we always prefer a [minimal, reproducible example](https://stackoverflow.com/help/minimal-reproducible-example) when looking at a bug report. Here are a few things you can do to write the perfect example when you encounter an issue with WebContainer. 4 | 5 | ## Try Locally 6 | If a project is not working as expected, it might be due to an incompatibility with WebContainer. However, please do check that the project runs as expected in your local machine, with your Node installation. If it does run without issue locally, we are much more certain that we might be after a WebContainer compat issue. 7 | 8 | For some types of issues, it might not make sense to perform this verification, e.g. if you have an issue with the editor. 9 | 10 | ## Auto-execute Erroneous Command 11 | We always ask you to include a link to a blitz that shows the erroneous behavior. You can make things even easier to reproduce if you configure it so the command that triggers the error is run automatically on start. You can do that by including a [custom `.stackblitzrc` configuration file](https://developer.stackblitz.com/docs/platform/project-config). 12 | 13 | 14 | ## Isolate Faulty API Calls 15 | 16 | WebContainer does not cover the whole [Node.js API](https://nodejs.org/dist/v14.6.0/docs/api/), so most of the times the underlying issue is a single API call that is not behaving properly. You might find the issue when trying some script or workflow in your favorite framework, but ideally the reproduction example would be a simple Node.js script, with few or even no dependencies at all, that triggers the faulty API call immediately. 17 | 18 | Remember that WebContainer allows you to debug your code! If you open the DevTools panel, all your code plus all your dependencies is there. You can also edit individual files and add `debugger` statements at will. It's almost magical! 19 | 20 | ## Read the Error 21 | 22 | This is always good advice! But seriously, sometimes the error message will give you strong hints of what's going on. For instance, it might report that it did not find an executable file that it's usually available on local environments, or that it attempted to run a shell script with features we don't support yet. 23 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/bug_report.yml: -------------------------------------------------------------------------------- 1 | name: "Bug report" 2 | description: Create a report to help us improve 3 | body: 4 | - type: markdown 5 | attributes: 6 | value: | 7 | Thank you for reporting an issue :pray:. 8 | 9 | Please read our [guidelines to report issues](https://github.com/stackblitz/webcontainer-core/blob/main/repro.md). 10 | 11 | This issue tracker is for bugs and issues found within WebContainer. 12 | If you experience issues unrelated to WebContainer, please file an issue in our StackBlitz core repo. https://github.com/stackblitz/core 13 | 14 | The more information you fill in, the better we can help you. 15 | - type: textarea 16 | id: description 17 | attributes: 18 | label: Describe the bug 19 | description: Provide a clear and concise description of what you're running into. 20 | validations: 21 | required: true 22 | - type: input 23 | id: link 24 | attributes: 25 | label: Link to the blitz that caused the error 26 | description: Please make sure the blitz is not private. Do not delete it after reporting! 27 | validations: 28 | required: true 29 | - type: textarea 30 | id: steps 31 | attributes: 32 | label: Steps to reproduce 33 | description: Describe the steps we have to take to reproduce the behavior. 34 | placeholder: | 35 | 1. Go to '...' 36 | 2. Click on '....' 37 | 3. Scroll down to '....' 38 | 4. See error 39 | validations: 40 | required: true 41 | - type: textarea 42 | id: expected 43 | attributes: 44 | label: Expected behavior 45 | description: Provide a clear and concise description of what you expected to happen. 46 | validations: 47 | required: true 48 | - type: checkboxes 49 | id: local-verification 50 | attributes: 51 | label: Parity with Local 52 | description: Does the issue appear only when running the WebContainer project? Or does it also appear locally? 53 | options: 54 | - label: I have [run the project in my local machine](https://github.com/stackblitz/webcontainer-core/blob/main/repro.md#try-locally) and I could not reproduce the issue. 55 | required: true 56 | - type: textarea 57 | id: screenshots 58 | attributes: 59 | label: Screenshots 60 | description: If applicable, add screenshots to help explain your problem. 61 | - type: textarea 62 | id: platform 63 | attributes: 64 | label: Platform 65 | value: | 66 | - OS: [e.g. macOS, Windows, Linux] 67 | - Browser: [e.g. Chrome, Safari, Firefox] 68 | - Version: [e.g. 91.1] 69 | - type: textarea 70 | id: additional 71 | attributes: 72 | label: Additional context 73 | description: Add any other context about the problem here. -------------------------------------------------------------------------------- /.github/workflows/check-project.yml: -------------------------------------------------------------------------------- 1 | on: 2 | issues: 3 | types: [opened, edited] 4 | jobs: 5 | checkProject: 6 | if: "${{ contains(github.event.issue.body, 'Describe the bug') }}" 7 | runs-on: ubuntu-latest 8 | steps: 9 | - uses: actions/github-script@v7 10 | name: Check for StackBlitz or Bolt reproduction link 11 | with: 12 | script: | 13 | const issue = await github.rest.issues.get({ 14 | issue_number: context.issue.number, 15 | owner: context.repo.owner, 16 | repo: context.repo.repo, 17 | }); 18 | 19 | const projectInfo = parseProjectInfo(issue.data.body ?? ''); 20 | 21 | if (!projectInfo) { 22 | // if no project info is found, we can assume that the user did not provide a StackBlitz or Bolt reproduction link 23 | await comment(issue.data, 'We noticed that you did not provide a StackBlitz or Bolt reproduction link. Please update the issue and add a link to a public project.'); 24 | 25 | return; 26 | } 27 | 28 | const projectExists = await checkProject(projectInfo); 29 | 30 | if (!projectExists) { 31 | // if the response is not ok, we can assume that the project is not public 32 | await comment(issue.data, 'We noticed that the project you shared is not public. Please change the visibility of the project to either secret or public.'); 33 | 34 | return; 35 | } 36 | 37 | // we can remove the label in case it was added before 38 | await removeLabel(); 39 | 40 | function parseProjectInfo(comment) { 41 | const reproRegex = /https:\/\/(?:stackblitz\.com|bolt\.new)\/(?:(?:~|c)\/)?(?:edit\/)?(?[a-zA-Z0-9-]+)/i; 42 | 43 | const { slug } = comment.match(reproRegex)?.groups || {}; 44 | 45 | if (!slug) { 46 | return null; 47 | } 48 | 49 | // if the slug is `github`, we test if a GitHub link is provided 50 | if (slug === 'github') { 51 | const githubRegex = /https:\/\/stackblitz\.com\/(?:~\/(?:github\.com|github_project)|github)\/(?[\w\-_]+)\/(?[\w\-_]+)/i; 52 | 53 | const { owner, repo } = comment.match(githubRegex)?.groups || {}; 54 | 55 | if (owner && repo) { 56 | return { type: 'github', owner, repo }; 57 | } 58 | } 59 | 60 | return { type: 'stackblitz', slug }; 61 | } 62 | 63 | async function checkProject(projectInfo) { 64 | if (projectInfo.type === 'github') { 65 | const { owner, repo } = projectInfo; 66 | 67 | try { 68 | const response = await github.rest.repos.get({ 69 | owner, 70 | repo, 71 | }); 72 | 73 | return response.status === 200; 74 | } catch { 75 | return false; 76 | } 77 | } 78 | 79 | if (projectInfo.type === 'stackblitz') { 80 | const { slug } = projectInfo; 81 | 82 | const response = await fetch(`https://stackblitz.com/api/projects/${slug}`, { 83 | method: 'HEAD', 84 | }); 85 | 86 | return response.ok; 87 | } 88 | 89 | return false; 90 | } 91 | 92 | async function comment(issue, body) { 93 | if (issue.labels.some((label) => label.name === 'needs reproduction')) { 94 | // do not comment or add the label again if we already have the label 95 | return; 96 | } 97 | 98 | await Promise.allSettled([ 99 | github.rest.issues.createComment({ 100 | issue_number: context.issue.number, 101 | owner: context.repo.owner, 102 | repo: context.repo.repo, 103 | body, 104 | }), 105 | github.rest.issues.addLabels({ 106 | issue_number: context.issue.number, 107 | owner: context.repo.owner, 108 | repo: context.repo.repo, 109 | labels: ['needs reproduction'], 110 | }) 111 | ]); 112 | } 113 | 114 | async function removeLabel() { 115 | await github.rest.issues.removeLabel({ 116 | issue_number: context.issue.number, 117 | owner: context.repo.owner, 118 | repo: context.repo.repo, 119 | name: 'needs reproduction', 120 | }); 121 | } 122 | --------------------------------------------------------------------------------