Commit Graph

43 Commits

Author SHA1 Message Date
Mofei Zhang d2018c51e1 [playground] Editing input shouldn't toggle diff view
ghstack-source-id: f9e80fc0c928e1ce1ec698d4d952e11402054843
Pull Request resolved: https://github.com/facebook/react-forget/pull/2833
2024-04-10 14:53:38 -04:00
Lauren Tan 6e65445911 Fix playground e2e test for real
ghstack-source-id: 1b52cb312a5f26e8e058bfe4a29b586ffaeb25d7
Pull Request resolved: https://github.com/facebook/react-forget/pull/2843
2024-04-11 12:13:59 -04:00
Lauren Tan 9cdd6b243e Fix playground e2e test
ghstack-source-id: 3904ff9beea21ffbb79a6a15fcfbb72f04a2d170
Pull Request resolved: https://github.com/facebook/react-forget/pull/2842
2024-04-10 18:17:38 -04:00
Lauren Tan 200b0f2333 Add aria-label to playground tabs
ghstack-source-id: 1c23bbbb55c1582a03674897b57c5061b895be83
Pull Request resolved: https://github.com/facebook/react-forget/pull/2841
2024-04-10 18:17:37 -04:00
Lauren Tan f990948a1f Small style tweaks to playground vertical tabs
ghstack-source-id: 56e72c56782274bdac92fdd131d2c9b33eb19052
Pull Request resolved: https://github.com/facebook/react-forget/pull/2840
2024-04-10 18:17:36 -04:00
Lauren Tan ed3bad0c2f Add aria-label to playground header buttons
ghstack-source-id: 4fdf672f02144e550d50b17f396a5d6d82dab5bd
Pull Request resolved: https://github.com/facebook/react-forget/pull/2839
2024-04-10 18:17:36 -04:00
Lauren Tan 7083231f6d Add link to GitHub repo in playground header
ghstack-source-id: 9fd0c2f8d70f8782602b0e4f8535b6be3ed89782
Pull Request resolved: https://github.com/facebook/react-forget/pull/2838
2024-04-10 18:17:35 -04:00
Lauren Tan b6c01f7f78 Remove playground wipe button
It was never clear to me what the difference between Wipe and Reset was.
Let's just get rid of one and reset to something more useful instead of
fibonacci.

ghstack-source-id: 4f88a1c1da2d0fd9e1f26e4859c12db0fc961af2
Pull Request resolved: https://github.com/facebook/react-forget/pull/2837
2024-04-10 17:46:35 -04:00
Lauren Tan 9ae3e74c3e Rename references to "forget" in playground
ghstack-source-id: fc2d58e4d5195c3ec157f65b3e1c94de39ff2070
Pull Request resolved: https://github.com/facebook/react-forget/pull/2836
2024-04-10 17:46:35 -04:00
Lauren Tan 594f335201 Show alert when url copied
ghstack-source-id: e8dba44d246d53f60a0858710cedf75c77c6c7e4
Pull Request resolved: https://github.com/facebook/react-forget/pull/2835
2024-04-10 17:46:34 -04:00
Lauren Tan 2f66d37cfd Use lz-string for playground state uri param
This compresses more efficiently than the base64 encoding we were
previously using, which makes sharing URLs a little less unwieldy and
takes up less space in local storage. Using
some real code as an example, lz-string compresses to 8040 bytes,
whereas the original base64 encoding we were using compresses to 16504
bytes

ghstack-source-id: b8f1089889b94b07d6f419606b798ffddb8863ba
Pull Request resolved: https://github.com/facebook/react-forget/pull/2834
2024-04-10 17:46:33 -04:00
Lauren Tan 5bf2323880 Fix missing playground snapshot
ghstack-source-id: f2c8a542b525ab8c91beaad6327c128a96d122f6
Pull Request resolved: https://github.com/facebook/react-forget/pull/2827
2024-04-08 11:23:29 -04:00
Lauren Tan 07a3404c5f Add basic playwright e2e test to playground 2024-04-03 18:12:29 -04:00
Lauren Tan ee24e3fc16 Dogfood uMC polyfill in playground 2024-04-03 18:12:29 -04:00
Joe Savona f33e63838d Update copyrights to reference Meta instead of Facebook
Thanks @zpao!!! This was mostly his work, i just fixed up the last bit.
2024-04-03 08:43:36 -07:00
Lauren Tan e61f983264 Fix yarn dev 2024-04-02 12:18:12 -04:00
Lauren Tan 4e6aa42773 Upgrade to typescript 5.4.3
This PR makes all packages share the same typescript version and updates us to 
latest versions of typescript, ts-node, typescript-eslint/eslint-plugin and 
typescript-eslint/parser. 

I also noticed that the tsconfig we were extending (node18-strictest) was 
deprecated, so I switched us over to one that's more up to date. 

Also had to make a couple of small changes to the playground so that continues 
to build correctly.
2024-04-02 10:32:23 -04:00
Lauren Tan 9d20aa2819 Don't compile node_modules on playground 2024-03-28 10:46:56 -04:00
Mofei Zhang b35779c6a4 [logger] Add CompilerDiagnostic category, thread Logger into environment 2024-03-20 13:48:18 -04:00
Jan Kassens 8c8e318bd4 Remove private header from playground
Remove private header from playground 

Before we miss removing this from the public release, I think we can remove this 
header now already. We're still behind a secret URL + password.
2024-03-18 16:53:47 -04:00
Sathya Gunasekaran ad8f19675c Infer type of React function
Infer if a function is a component or hook when we're deciding to compile a 
function and store that in the environment. 

This is used in passes like InferReferenceEffects rather than having to re-parse 
the name in each pass.
2024-02-29 14:47:51 -08:00
Mofei Zhang a06ded902a [other] Change instrumentation to use an optional gating identifier; record
filepath 

Internal rollout currently has a good number of test failures. 
`enableEmitInstrumentForget` can help developers understand which functions / 
files they should look at: 

``` 

// input 

function Foo() { 

userCode(); 

// ... 

} 

// output 

function Foo() { 

if (__DEV__ && inE2eTestMode) { 

logRender("Foo", "/path/to/filename.js"); 

} 

const $ = useMemoCache(...); 

userCode(); 

} 

```
2024-02-27 22:06:36 -08:00
Jan Kassens fb0cf4f833 Make collapsed playground tabs more compact
Make collapsed playground tabs more compact 

We have a lot of steps creating a lot of tabs by now. This makes them visually a 
lot more compact without a full redesign. 

Makes it a bit harder to read and less modern looking, but I think usability was 
a bit bad with the wide tabs. 

**Before:** 


![image](https://github.com/facebook/react-forget/assets/11849/a87c8f7e-d60c-43c1-aaea-1a1f77e082d0) 

**After:** 


![image](https://github.com/facebook/react-forget/assets/11849/227ebf1e-055f-439a-bfc9-e69bae091f6a)
2024-01-16 13:10:32 -05:00
Mofei Zhang 5b8e94c6d8 [ez][wip] Make playground more resilient to crashes
--- 

<img width="1031" alt="image" 
src="https://github.com/facebook/react-forget/assets/34200447/8e475472-45c3-4ef0-aa4b-d187e72b999c"> 

Behold! No instacrash on `useMemo()`
2023-11-21 09:30:29 -06:00
Sathya Gunasekaran eacf189eca [playground] Remove button from error message
We show the entire error in panel, no need to click to console.log 

This makes it easier to copy the error now. 

Before: 


https://github.com/facebook/react-forget/assets/565765/4c13abfe-a06d-4580-b3d7-b02792f53e57 

After: 


https://github.com/facebook/react-forget/assets/565765/0dff95cc-5207-48a5-a0b6-2055cadcb780
2023-11-16 12:01:59 +00:00
Sathya Gunasekaran 0821a57fa8 [playground] Capture Babel parsing errors
Before: 

<img width="1416" alt="Screenshot 2023-11-14 at 9 09 53 AM" 
src="https://github.com/facebook/react-forget/assets/565765/f53daf34-080a-4804-9a61-77c141c05d21"> 

After: 

<img width="1444" alt="Screenshot 2023-11-14 at 9 09 45 AM" 
src="https://github.com/facebook/react-forget/assets/565765/8861c266-9a49-4ff7-99cd-7240ca1750b1">
2023-11-14 18:24:38 +00:00
Sathya Gunasekaran 07d6c6d8aa [playground] Show error when compiling unsupported functions
Before: 

<img width="1117" alt="Screenshot 2023-11-14 at 9 11 28 AM" 
src="https://github.com/facebook/react-forget/assets/565765/d1ec2b5f-1bc5-4d29-9811-effcd39581e4"> 

After: 

<img width="1115" alt="Screenshot 2023-11-14 at 9 11 18 AM" 
src="https://github.com/facebook/react-forget/assets/565765/9a41889c-cf7b-4f31-8b6e-e26bfb204883">
2023-11-14 09:10:31 +00:00
Sathya Gunasekaran 33ffde4836 [playground] turn of ppr 2023-11-08 15:46:43 +00:00
Sathya Gunasekaran 00cb557b12 Add runtime validation for EnvironmentConfig 2023-11-07 11:04:37 +00:00
Lauren Tan d49eb8b580 [ez] Run copyright script 2023-11-02 12:43:35 -04:00
Sathya Gunasekaran dca54c8932 [playground] Use standalone prettier
All of these warnings go away: ``` ➜  playground git:(remove-prettier) ✗ yarn 
dev yarn run v1.22.19 $ NODE_ENV=development && next dev ready - started server 
on 0.0.0.0:3000, url: http://localhost:3000 warn  - You have enabled 
experimental feature (appDir) in next.config.js. warn  - Experimental features 
are not covered by semver, and may cause unexpected or broken application 
behavior. Use at your own risk. info  - Thank you for testing `appDir` please 
leave your feedback at https://nextjs.link/app-feedback 

event - compiled client and server successfully in 964 ms (199 modules) wait  - 
compiling /page (client and server)... warn  - 
../../node_modules/prettier/index.js Critical dependency: the request of a 
dependency is an expression 

../../node_modules/prettier/index.js Critical dependency: require function is 
used in a way in which dependencies cannot be statically extracted 

../../node_modules/prettier/index.js Critical dependency: the request of a 
dependency is an expression 

../../node_modules/prettier/index.js Critical dependency: the request of a 
dependency is an expression 

../../node_modules/prettier/third-party.js Critical dependency: the request of a 
dependency is an expression wait  - compiling... warn  - 
../../node_modules/prettier/index.js Critical dependency: the request of a 
dependency is an expression 

../../node_modules/prettier/index.js Critical dependency: require function is 
used in a way in which dependencies cannot be statically extracted 

../../node_modules/prettier/index.js Critical dependency: the request of a 
dependency is an expression 

../../node_modules/prettier/index.js Critical dependency: the request of a 
dependency is an expression 

../../node_modules/prettier/third-party.js Critical dependency: the request of a 
dependency is an expression ``` 

Standalone prettier is meant to be used in the browser: 
https://prettier.io/docs/en/browser
2023-11-02 07:00:05 -07:00
Mofei Zhang c7c57ec531 [playground] QoL use webpack to bundle monaco-editor's loader
--- 

This lets us load playground locally, entirely offline (e.g. on an airplane, 
when a cdn is down, at ReactAdvanced, etc) 

Before: 

See external script link 

<img width="691" alt="image" 
src="https://github.com/facebook/react-forget/assets/34200447/85500e86-c1a5-4dff-bdcd-58db0d6fd453"> 

Now: 

No external script 

<img width="476" alt="image" 
src="https://github.com/facebook/react-forget/assets/34200447/fdcbea09-0b5f-42e3-9310-35d8d1d726b7">
2023-10-30 14:53:00 -04:00
Mofei Zhang 16bef168c1 [playground] Move Editor/index for next PR (dynamic import) 2023-10-30 14:53:00 -04:00
Sathya Gunasekaran ad1fe50546 [playground] Turn on Forget
Runs Forget on the playground, so we can dogfood Forget and experiment with 
improvements to UX. 

Opts out of compiling the layout page because thats run on the server which 
doesn't seem to have access to useMemoCache.
2023-10-23 15:41:01 +01:00
Sathya Gunasekaran 1138ef00e3 [playground] Force nextjs to use experimental react
These experimental features aren't used by the playground, but turning it on 
forces nextjs to use experimental react which has the useMemoCache hook.
2023-10-23 15:41:00 +01:00
Sathya Gunasekaran 48d465eb22 [playground] Upgrade to latest nextjs 2023-10-23 15:41:00 +01:00
Lauren Tan 640994f49b [playground] Only log error to console when clicked 2023-10-16 15:54:33 +01:00
Joe Savona 2b417e2a52 Playground uses new pragma parser, shows config being used
The playground now uses the new pragma parser so it's guaranteed to use the 
right defaults and have consistent parsing with snap/sprout. In addition, we now 
emit a debug event from the compiler which contains pretty-printed environment 
config, making it easy to check which settings are being applied in playground. 

<img width="3008" alt="Screenshot 2023-10-05 at 11 05 58 AM" 
src="https://github.com/facebook/react-forget/assets/6425824/2417f40c-1320-4c39-a661-a4e34e3d69c4">
2023-10-05 11:06:56 -07:00
Joe Savona 80d867d1bd Promote inlineUseMemo to stable (remove flag)
Per title, this feature flag is enabled everywhere and is clearly stable, let's 
promote to stable and remove the flag to simplify.
2023-10-05 09:20:19 -07:00
Joe Savona 11d03ffbe0 Promote enableFunctionCallSignatureOptimizations to stable (remove flag)
Per title, this feature flag is enabled everywhere and is clearly stable, let's 
promote to stable and remove the flag to simplify.
2023-10-05 09:20:09 -07:00
Joe Savona 0b0f8994ba Promote enableTreatHooksAsFunctions to stable (remove flag)
Per title, this feature flag is enabled everywhere and is clearly stable, let's 
promote to stable and remove the flag to simplify.
2023-10-05 09:20:05 -07:00
Joe Savona cee08ba750 [rfc] Dont convert ArrowFunction to FunctionDecl
This PR changes the way we compile ArrowFunctionExpression to allow compiling 
more cases, such as within `React.forwardRef()`. We no longer convert arrow 
functions to function declarations. Instead, CodeGenerator emits a generic 
`CodegenFunction` type, and `Program.ts` is responsible for converting that to 
the appropriate type. The rule is basically: 

* Retain the original node type by default. Function declaration in, function 
declaration out. Arrow function in, arrow function out. 

* When gating is enabled, we emit a ConditionalExpression instead of creating a 
temporary variable. If the original (and hence compiled) functions are function 
declarations, we force them into FunctionExpressions only here, since we need an 
expression for each branch of the conditional. Then the rules are: 

* If this is a `export function Foo` ie a named export, replace it with a 
variable declaration with the conditional expression as the initializer, and the 
function name as the variable name. 

* Else, just replace the original function node with the conditional. This works 
for all other cases. 

I'm open to feedback but this seems like a pretty robust approach and will allow 
us to support a lot of real-world cases that we didn't yet, so i think we need 
_something_ in this direction.
2023-08-29 22:09:41 +01:00
lauren a0dc166991 [rfc] Remove top level forget directory
Sorry about the thrash in advance! This removes the top level `forget` directory 
which adds unnecessary nesting to our repo 

Hopefully everything still works
2023-08-22 15:04:54 -04:00