What’s New

Features

1. Team members management in the dashboard
2. Add freezing/unfreezing in the dashboard
3. Update Algolia info to use our new index
4. Allow changing privacy of multiple sandboxes
5. @JohnPremKumar Additional properties added to Preview Manager
6. @maier49 Add missing js modules for dojo styles

Fixes

• Merge user initialisation into one function
• Propagate hyperlink clicks
• Notify auth on commit
• Fix overflow issue in external dependencies

Features

1. Google Sign-In
2. New Github VScode themes
3. Update prettier to 2.0.5
4. Updated Embed UI
5. Updated Overmind
6. @Saurabhdaware added .abell language features to vscode-extensions

Fixes

• Fixed Stackbit sign in
• Fixed create sandbox modal for mobile devices
• Fixed reloading the source sandbox after dealing with a sync
• Fixed UI where “configuration indicator” was covering the search box

Features

1. Repositories Sandboxes in the Dashboard
   Quickly access all our sandboxes linked with GitHub from the dashboard
2. Codesandbox now sets the TypeScript version of the editor dynamically
3. Added Sass and CSS support to Svelte template

Fixes

• Fixed several smaller issues related to GitHub syncing
• Fixed updating git changes after doing a sync
• Fixed reloading the source sandbox after dealing with a sync
• Several improvements to the new Dashboards
• Toggle fullscreen view on Safari
• Added env variable to SSE docs

A New Dashboard Built for Collaboration

We've introduced workspaces and refreshed the design of the dashboard to make working with teams and more sandboxes a better experience.

Features

1. Workspaces enable you to work on sandboxes with teams of people and keep your personal projects separate
2. A new start screen that lists only the most recent stuff you're likely to want to dive back in to
3. By default, new projects now go into drafts so important sandboxes are easier to find
4. List view is perfect for those of you with a large number of sandboxes
5. The dashboard is now keyboard accessible, so you can move around and open sandboxes using only keys
6. The design is responsive, so you can get to your sandboxes quicker when on mobile
7. You can now reload the preview with CMD+SHIFT+R

Fixes

• Made bracket matches more apparent in the CSB Black theme
• We now close the modal after importing a GitHub repo on the Create Sandbox screen
• Fixed an issue with being unable to save all after reloading a sandbox with unsaved changes
• @jyash97 made sure you can't invite yourself to a workspace

A Better GitHub Workflow

You've been able to import and export projects to and from GitHub on CodeSandbox for a while, but the workflow was confusing. This update makes working with GitHub repos more user-friendly.

Features

1. Refined the core GitHub flow - you can now start a PR while staying in the same sandbox
2. GitHub sandboxes are now visually distinct from regular sandboxes, with status indicators and instructions so next steps are clearer
3. Added new functionality to keep a sandbox in sync with a GitHub repo and resolve conflicts

Fixes

• Improved execution time of custom Babel presets and plugins, reducing transpilation time of Vue from 18 to 2 seconds
• Added caching to Vue project transpilation
• Fixed an issue that meant we'd refresh the preview instead of hot reload in some cases
• Squashed a regression with dynamic imports
• Fixed a UI issue where old and new sandbox names would overlap while changing the name
• Resolved a UI issue with templates not being shown correctly in Template Universe for some users
• @sunnyssr fixed a bug with showing the incorrect branch name
• @jyash97 fixed an issue with invalid color codes that could cause a crash
• @akash-joshi resolved a styling bug on the recent page of the dashboard

Features

1. We now allow markdown in sandbox descriptions

Fixes

• We changed how we handle browser authentication to make it more reliable
• Fixed edge-cases in Live for those with flaky connections
• Resolved an issue with changing files after forking
• Fixed an issue with the upload icon not showing in private sandboxes
• Made further fixes for handling edge-cases in ES Modules
• @tehnuge fixed icon padding in the deployment modal
• @layershifter made exports mutable

Fixes

• We reduced the time it takes to run syntax highlighting by 3x in most cases
• Several fixes to resolve edge-cases in how the bundler handles ES modules
• We now better handle projects that define an invalid "modules" entry-point
• We also improved our handling of dynamic imports
• We fixed an overflow issue for long dependency names in the editor
• We removed the now superfluous notification that you're live since sandboxes are live by default

Features

1. Static sites no longer require a package.json file to import and run
2. The bundler now resolves ES modules by default for consistency with other bundlers
3. Added support for dynamic Webpack loaders
4. We now send environment variables to Vercel as secrets when deploying
5. Enabled xr-spatial-tracking support in the preview for WebXR projects
6. @flickz added allow-autoplay support to previews too
7. Added this changelog to a "What's new" section in the Create Sandbox screen

Fixes

• We improved bundler compile speed
• Fixed up an issue with signing in on mobile
• @timothyis fixed Vercel logo dimensions
• Updated touch icons for iOS on mobile
• Resolved an issue with viewing sandbox config files in embeds
• Fixed ES module conversion for cyclic dependencies
• @jyash97 fixed an issue with file references in URLs
• Fixed some issues with saving live sandboxes
• Added support for tsconfig in Vue
• Binary files now correctly import in private sandboxes

Features

1. Team names are now editable

Fixes

• We improved editor rendering performance
• We also improved performance when opening and closing files or directories, and switching between them
• We updated the design of the 404 page and sign-in modal
• @arthurdenner fixed up keyboard navigation when searching in Template Universe
• We no longer show the "More" button in Presence if there's just one more user to show
• @arthurdenner and timothyis helped replace references of Zeit to Vercel
• We now properly handle environment variables that contain quotes

Features

1. You can now invite team members via email or by sharing a link
2. Usernames now autocomplete when inviting team members
3. Added a config option to specify a custom start script in container sandboxes
4. @jyash97 added a copy link to templates in the context menu on the dashboard
5. Updated the styling of the preferences menu to match design changes in the editor
6. We now link to example sandboxes that use a dependency from the list of dependencies in the editor

Fixes

• Updated the privacy policy to more clearly explain what data we store and why
• The UI for editing Prettier and Sandbox config files now works properly again
• Made TypeScript error language consistent with errors shown elsewhere in the editor
• @tanmoyopenroot fixed refreshing of hash-based URLs in the preview window

Features

1. You can now highlight a selection of code when sharing a sandbox URL
2. We no longer show ads in the editor to anonymous users
3. @jyash97 added a copy sandbox link option for sandboxes on the dashboard
4. We added a button when viewing previews fullscreen to protect folks from phishing attempts

Fixes

• We introduced a new way of loading dependencies reducing first-time install times by up to 60x and 4x when cached
• Lots of tweaks to Live making it handle edge-cases more reliably
• We made some performance improvements that make VSCode load faster
• VSCode user snippets and extension quick input commands work again
• We’ve updated the TypeScript version in the editor from 3.6 to 3.8
• Upgraded the type fetching service to handle more concurrent requests and type more dependencies
• We now display the correct loading state for buttons when forking
• Fixed running Jest tests with JSDOM
• Setting custom VSCode themes now works again
• We now show the reason why an import has failed rather than just the error code
• Fixed-up an error message when opening markdown files
• Fixed bundler issues resolving Sass imports and importing CSS from npm dependencies
• We now show the anonymous sandbox limit error if it’s reached when forking from the “Create New Sandbox” screen
• Fixed an issue which prevented changing modes in a live session
• @MichaelDeBoey and @FWeinb updated embed example code to allow more services
• We now show huge text files properly in the editor although they are read-only
• Handlebar files are now handled correctly
• Thanks to @jyash97 we now hide delete buttons on the liked sandboxes page of user profiles
• We now support showing type definitions from dependencies that have git dependencies

Features

1. Following of read-only users and seeing their cursors if you follow them
2. @tanmoyopenroot added a keyboard shortcut Ctrl + Backtick to toggle opening and closing the console
3. Thanks to @jamime, sandboxes can now consume packages that use an npm alias

Fixes

• Fixed an alignment issue with the Share icon
• @tanmoyopenroot made the template icon popup close upon selecting the icon
• We now correctly reset live counters after a sandbox is changed
• Fixed up an issue impacting live throttling when editing a sandbox solo
• Selections are now more stable in live sessions
• Fixed React Refresh HMR for class components
• You can now fork a sandbox twice again
• Fixed creating private github repos from private sandboxes
• Improved stability of reconnects in CodeSandbox Live

Live 2.0

We're working to redefine how folks collaborate on code. This upgrade to CodeSandbox Live delivers a step-change in collaboration on CodeSandbox, making it easier for teams to code together and lays the groundwork for further improvements.

Features

1. All sandboxes are now live by default
2. Added a new access control panel to invite others and set permissions
3. Avatars of team members and guests appear in the editor
4. Follower mode now supports scrolling

A Snappier, New Look Editor

When chatting with folks in the CodeSandbox community, there’s one word that comes up more than any other: Speed! So we've evolved the design of the editor and undertaken a range of performance optimization tasks so that the editor now loads more quickly, and feels more responsive.

Features

1. Added progressive loading of each part of the editor instead of waiting for everything to be ready upfront
2. Re-designed the activity bar and all component parts
3. Updated the navigation bar design
4. Added a new default theme: CodeSandbox Black

Fixes

• Performance improvements

Introducing Template Universe

Template Universe enables you to share and use templates created by the community and makes it possible for the maintainers of frameworks and libraries to add official ones too.

Features

1. New 'Explore Templates' section added to Create Sandbox screen curating community-created and official templates into categories
2. Added ability to search templates by keyword on the Create Sandbox screen
3. You can now bookmark templates you find useful for quick access in future

Fixes

• We removed sandbox creation limits for all users

Features

1. Stable support for CodeSandbox Containers, which execute the code you write on a server instead of in the browser.
2. You can now add environment variables to a container

Fixes

• Made infrastructure changes to deliver performance improvements to containers.
• Increased container creation limits
• Trashed sandboxes no longer count towards sandbox creation limits

Features

1. VS Code is now the core editor in CodeSandbox, enabling keybindings, user snippets, commands, editor grid view and more
2. We now support some VS Code extensions, including native TypeScript type checking, automatic import of variables, refactoring support, and VIM mode
3. Added a devtool view with tabs for tests and console
4. A new design, including menu and status bar and UI changes
5. Added GraphQL, styled-components and yarn.lock syntax highlighting/autocompletions

Fixes

• VS Code elements like the configuration UI and the image viewer now work
• We no longer hide the activity bar when viewing a sandbox you don't own

Features

1. Thanks to @xyc, the console now supports multiline commands and syntax highlighting
2. We now support configuration files for Prettier, Babel, CodeSandbox, and others
3. Added a UI for some configuration files, like sandbox.config.json, to make changing settings more intuitive
4. Community and official Babel plugins are now supported
5. @gautamarora added native Jest integration for running tests within the editor
6. Hot Module Reloading is available in previews

Features

1. You can now commit and open PRs on GitHub as well as create repositories from a sandbox
2. We've added support for static file hosting so you can use binary assets within your projects

Features

1. We now use the Monaco editor adding support for IntelliSense, so you can use Peek Definition, Go to Definition, Find all References, etc.
2. ESLint, Prettier, and Emmet.io are now built into the editor
3. For React, we've added support for react-error-overlay for clear error descriptions and fix suggestions
4. You can open the editor and the preview while offline
5. It's possible to open sandbox previews in a new window

Fixes

• The packager has been rewritten resulting in significant performance improvements