Best JavaScript code snippet using playwright-internal
get-label-from-stack-trace.js
Source: get-label-from-stack-trace.js
1// @flow2import { getLabelFromStackTrace } from '../src/get-label-from-stack-trace'3/**4 * # Safari stack traces5 *6 * The component name may not appear in the Safari stack trace because Safari7 * implements Proper Tail Calls.8 *9 * Two components that seem almost identical may produce different stack traces10 * based on whether or not a Proper Tail Call optimization was possible. As a11 * result, you may not get the same stack traces if you try to reproduce these12 * test cases on your own.13 *14 * If Safari omits the component name from the stack trace, the best thing we15 * can do is:16 *17 * 1. Match the parent component's name if it is in the stack trace, or18 * 2. Return `undefined`.19 */20// Ensure that it works for components that have numbers and $ in their name21const expectedLabel = 'MyComponent-9'22/**23 * E.g.24 *25 * ```26 * function MyComponent$9() {27 * return <div css={{ color: 'red' }} />28 * }29 * ```30 *31 * See `playgrounds/cra/.env` for instructions on testing with the old JSX32 * transform.33 *34 * All tests after this block are for runtime=automatic, i.e. the new JSX35 * transform introduced in React 1736 */37describe('typical function component - runtime=classic', () => {38 test('Chrome', () => {39 // Each "at" line starts with some whitespace40 const stackTrace = `Error41 at createEmotionProps (emotion-element-1fb5ab00.browser.esm.js:143)42 at jsx (emotion-react.browser.esm.js:100)43 at MyComponent$9 (App.js:22)44 at renderWithHooks (react-dom.development.js:14803)45 at mountIndeterminateComponent (react-dom.development.js:17482)46 at beginWork (react-dom.development.js:18596)`47 expect(getLabelFromStackTrace(stackTrace)).toBe(expectedLabel)48 })49 test('Firefox', () => {50 const stackTrace = `createEmotionProps@http://localhost:3000/static/js/bundle.js:46440:4051jsx@http://localhost:3000/static/js/bundle.js:46636:11352MyComponent$9@http://localhost:3000/static/js/bundle.js:47600:7253renderWithHooks@http://localhost:3000/static/js/bundle.js:18904:2754mountIndeterminateComponent@http://localhost:3000/static/js/bundle.js:21583:1355beginWork@http://localhost:3000/static/js/bundle.js:22697:16`56 expect(getLabelFromStackTrace(stackTrace)).toBe(expectedLabel)57 })58 test('Safari', () => {59 const stackTrace = `createEmotionProps@http://localhost:3000/static/js/bundle.js:46440:4960jsx@http://localhost:3000/static/js/bundle.js:46635:11361renderWithHooks@http://localhost:3000/static/js/bundle.js:18904:2762mountIndeterminateComponent@http://localhost:3000/static/js/bundle.js:21583:2863beginWork$1@http://localhost:3000/static/js/bundle.js:27280:23`64 expect(getLabelFromStackTrace(stackTrace)).toBeUndefined()65 })66 test('SSR', () => {67 const stackTrace = `Error68 at Object.createEmotionProps (webpack-internal:///../../packages/react/dist/emotion-element-7a506f09.cjs.dev.js:195:40)69 at jsx (webpack-internal:///../../packages/react/dist/emotion-react.cjs.dev.js:103:45)70 at MyComponent$9 (webpack-internal:///./pages/index.js:20:61)71 at processChild (C:/Projects/OSS/emotion/node_modules/react-dom/cjs/react-dom-server.node.development.js:3043:14)72 at resolve (C:/Projects/OSS/emotion/node_modules/react-dom/cjs/react-dom-server.node.development.js:2960:5)73 at ReactDOMServerRenderer.render (C:/Projects/OSS/emotion/node_modules/react-dom/cjs/react-dom-server.node.development.js:3435:22)74 at ReactDOMServerRenderer.read (C:/Projects/OSS/emotion/node_modules/react-dom/cjs/react-dom-server.node.development.js:3373:29)75 at Object.renderToString (C:/Projects/OSS/emotion/node_modules/react-dom/cjs/react-dom-server.node.development.js:3988:27)76 at Object.renderPage (C:/Projects/OSS/emotion/node_modules/next/dist/server/render.js:621:45)77 at Object.defaultGetInitialProps (C:/Projects/OSS/emotion/node_modules/next/dist/server/render.js:301:51)`78 expect(getLabelFromStackTrace(stackTrace)).toBe(expectedLabel)79 })80})81/**82 * E.g.83 *84 * ```85 * function MyComponent$9() {86 * return <div css={{ color: 'red' }} />87 * }88 * ```89 */90describe('typical function component', () => {91 test('Chrome', () => {92 const stackTrace = `Error93 at createEmotionProps (emotion-element-895e3bbe.browser.esm.js:142)94 at jsxDEV (emotion-react-jsx-dev-runtime.browser.esm.js:18)95 at MyComponent$9 (App.js:5)96 at renderWithHooks (react-dom.development.js:14803)97 at mountIndeterminateComponent (react-dom.development.js:17482)98 at beginWork (react-dom.development.js:18596)99 at beginWork$1 (react-dom.development.js:23179)`100 expect(getLabelFromStackTrace(stackTrace)).toBe(expectedLabel)101 })102 test('Firefox', () => {103 const stackTrace = `createEmotionProps@http://localhost:3000/static/js/main.chunk.js:844:40104jsxDEV@http://localhost:3000/static/js/main.chunk.js:1126:247105MyComponent$9@http://localhost:3000/static/js/main.chunk.js:2274:92106renderWithHooks@http://localhost:3000/static/js/vendors~main.chunk.js:16616:31107mountIndeterminateComponent@http://localhost:3000/static/js/vendors~main.chunk.js:19228:17108beginWork@http://localhost:3000/static/js/vendors~main.chunk.js:20306:20`109 expect(getLabelFromStackTrace(stackTrace)).toBe(expectedLabel)110 })111 test('Safari', () => {112 const stackTrace = `createEmotionProps@http://localhost:3000/static/js/main.chunk.js:844:49113jsxDEV@http://localhost:3000/static/js/main.chunk.js:1126:247114MyComponent$9@http://localhost:3000/static/js/main.chunk.js:2274:92115renderWithHooks@http://localhost:3000/static/js/vendors~main.chunk.js:16616:31116mountIndeterminateComponent@http://localhost:3000/static/js/vendors~main.chunk.js:19228:32117beginWork$1@http://localhost:3000/static/js/vendors~main.chunk.js:24848:27`118 expect(getLabelFromStackTrace(stackTrace)).toBe(expectedLabel)119 })120 test('SSR', () => {121 const stackTrace = `Error122 at Object.createEmotionProps (webpack-internal:///../../packages/react/dist/emotion-element-7a9c77b4.cjs.dev.js:175:40)123 at jsxDEV (webpack-internal:///../../packages/react/jsx-dev-runtime/dist/emotion-react-jsx-dev-runtime.cjs.dev.js:22:75)124 at MyComponent$9 (webpack-internal:///./pages/index.js:60:85)125 at processChild (C:/Projects/OSS/emotion/node_modules/react-dom/cjs/react-dom-server.node.development.js:3043:14)126 at resolve (C:/Projects/OSS/emotion/node_modules/react-dom/cjs/react-dom-server.node.development.js:2960:5)127 at ReactDOMServerRenderer.render (C:/Projects/OSS/emotion/node_modules/react-dom/cjs/react-dom-server.node.development.js:3435:22)128 at ReactDOMServerRenderer.read (C:/Projects/OSS/emotion/node_modules/react-dom/cjs/react-dom-server.node.development.js:3373:29)129 at Object.renderToString (C:/Projects/OSS/emotion/node_modules/react-dom/cjs/react-dom-server.node.development.js:3988:27)130 at Object.renderPage (C:/Projects/OSS/emotion/node_modules/next/dist/server/render.js:621:45)131 at Object.defaultGetInitialProps (C:/Projects/OSS/emotion/node_modules/next/dist/server/render.js:301:51)`132 expect(getLabelFromStackTrace(stackTrace)).toBe(expectedLabel)133 })134})135/**136 * E.g.137 *138 * ```139 * function MyComponent$9() {140 * function renderSpan() {141 * return <span css={{ color: 'orchid' }}>Orchid</span>142 * }143 *144 * return <div>{renderSpan()}</div>145 * }146 * ```147 */148describe('render function within function component', () => {149 test('Chrome', () => {150 const stackTrace = `Error151 at createEmotionProps (emotion-element-895e3bbe.browser.esm.js:142)152 at jsxDEV (emotion-react-jsx-dev-runtime.browser.esm.js:18)153 at renderSpan (App.js:5)154 at MyComponent$9 (App.js:8)155 at renderWithHooks (react-dom.development.js:14803)156 at mountIndeterminateComponent (react-dom.development.js:17482)157 at beginWork (react-dom.development.js:18596)`158 expect(getLabelFromStackTrace(stackTrace)).toBe(expectedLabel)159 })160 test('Firefox', () => {161 const stackTrace = `createEmotionProps@http://localhost:3000/static/js/main.chunk.js:844:40162jsxDEV@http://localhost:3000/static/js/main.chunk.js:1126:247163renderSpan@http://localhost:3000/static/js/main.chunk.js:2273:89164MyComponent$9@http://localhost:3000/static/js/main.chunk.js:2287:15165renderWithHooks@http://localhost:3000/static/js/vendors~main.chunk.js:16616:31166mountIndeterminateComponent@http://localhost:3000/static/js/vendors~main.chunk.js:19228:17167beginWork@http://localhost:3000/static/js/vendors~main.chunk.js:20306:20168beginWork$1@http://localhost:3000/static/js/vendors~main.chunk.js:24848:18`169 expect(getLabelFromStackTrace(stackTrace)).toBe(expectedLabel)170 })171 test('Safari', () => {172 const stackTrace = `createEmotionProps@http://localhost:3000/static/js/main.chunk.js:844:49173jsxDEV@http://localhost:3000/static/js/main.chunk.js:1126:247174MyComponent$9@http://localhost:3000/main.4d087bc1a783e9f2b657.hot-update.js:36:25175renderWithHooks@http://localhost:3000/static/js/vendors~main.chunk.js:16616:31176updateFunctionComponent@http://localhost:3000/static/js/vendors~main.chunk.js:18795:39177beginWork$1@http://localhost:3000/static/js/vendors~main.chunk.js:24848:27`178 expect(getLabelFromStackTrace(stackTrace)).toBe(expectedLabel)179 })180 test('SSR', () => {181 const stackTrace = `Error182 at Object.createEmotionProps (webpack-internal:///../../packages/react/dist/emotion-element-7a9c77b4.cjs.dev.js:175:40)183 at jsxDEV (webpack-internal:///../../packages/react/jsx-dev-runtime/dist/emotion-react-jsx-dev-runtime.cjs.dev.js:22:75)184 at renderSpan (webpack-internal:///./pages/index.js:28:82)185 at MyComponent$9 (webpack-internal:///./pages/index.js:71:15)186 at processChild (C:/Projects/OSS/emotion/node_modules/react-dom/cjs/react-dom-server.node.development.js:3043:14)187 at resolve (C:/Projects/OSS/emotion/node_modules/react-dom/cjs/react-dom-server.node.development.js:2960:5)188 at ReactDOMServerRenderer.render (C:/Projects/OSS/emotion/node_modules/react-dom/cjs/react-dom-server.node.development.js:3435:22)189 at ReactDOMServerRenderer.read (C:/Projects/OSS/emotion/node_modules/react-dom/cjs/react-dom-server.node.development.js:3373:29)190 at Object.renderToString (C:/Projects/OSS/emotion/node_modules/react-dom/cjs/react-dom-server.node.development.js:3988:27)191 at Object.renderPage (C:/Projects/OSS/emotion/node_modules/next/dist/server/render.js:621:45)`192 expect(getLabelFromStackTrace(stackTrace)).toBe(expectedLabel)193 })194})195/**196 * E.g.197 *198 * ```199 * function MyComponent$9() {200 * return <div>201 * {[0].map(i => <div css={{ color: 'red' }} key={i} />)}202 * </div>203 * }204 * ```205 */206describe('element returned by Array.map', () => {207 test('Chrome', () => {208 const stackTrace = `Error209 at createEmotionProps (emotion-element-895e3bbe.browser.esm.js:142)210 at jsxDEV (emotion-react-jsx-dev-runtime.browser.esm.js:18)211 at App.js:5212 at Array.map (<anonymous>)213 at MyComponent$9 (App.js:5)214 at renderWithHooks (react-dom.development.js:14803)215 at mountIndeterminateComponent (react-dom.development.js:17482)216 at beginWork (react-dom.development.js:18596)217 at beginWork$1 (react-dom.development.js:23179)`218 expect(getLabelFromStackTrace(stackTrace)).toBe(expectedLabel)219 })220 test('Firefox', () => {221 const stackTrace = `createEmotionProps@http://localhost:3000/static/js/main.chunk.js:844:40222jsxDEV@http://localhost:3000/static/js/main.chunk.js:1126:247223MyComponent$9/<.children<@http://localhost:3000/static/js/main.chunk.js:2274:106224MyComponent$9@http://localhost:3000/static/js/main.chunk.js:2274:19225renderWithHooks@http://localhost:3000/static/js/vendors~main.chunk.js:16616:31226mountIndeterminateComponent@http://localhost:3000/static/js/vendors~main.chunk.js:19228:17227beginWork@http://localhost:3000/static/js/vendors~main.chunk.js:20306:20228beginWork$1@http://localhost:3000/static/js/vendors~main.chunk.js:24848:18`229 expect(getLabelFromStackTrace(stackTrace)).toBe(expectedLabel)230 })231 test('Safari', () => {232 const stackTrace = `createEmotionProps@http://localhost:3000/static/js/main.chunk.js:844:49233jsxDEV@http://localhost:3000/static/js/main.chunk.js:1126:247234map@[native code]235MyComponent$9@http://localhost:3000/static/js/main.chunk.js:2274:22236renderWithHooks@http://localhost:3000/static/js/vendors~main.chunk.js:16616:31237mountIndeterminateComponent@http://localhost:3000/static/js/vendors~main.chunk.js:19228:32238beginWork$1@http://localhost:3000/static/js/vendors~main.chunk.js:24848:27`239 expect(getLabelFromStackTrace(stackTrace)).toBe(expectedLabel)240 })241 test('SSR', () => {242 const stackTrace = `Error243 at Object.createEmotionProps (webpack-internal:///../../packages/react/dist/emotion-element-7a9c77b4.cjs.dev.js:175:40)244 at jsxDEV (webpack-internal:///../../packages/react/jsx-dev-runtime/dist/emotion-react-jsx-dev-runtime.cjs.dev.js:22:75)245 at eval (webpack-internal:///./pages/index.js:78:99)246 at Array.map (<anonymous>)247 at MyComponent$9 (webpack-internal:///./pages/index.js:78:19)248 at processChild (C:/Projects/OSS/emotion/node_modules/react-dom/cjs/react-dom-server.node.development.js:3043:14)249 at resolve (C:/Projects/OSS/emotion/node_modules/react-dom/cjs/react-dom-server.node.development.js:2960:5)250 at ReactDOMServerRenderer.render (C:/Projects/OSS/emotion/node_modules/react-dom/cjs/react-dom-server.node.development.js:3435:22)251 at ReactDOMServerRenderer.read (C:/Projects/OSS/emotion/node_modules/react-dom/cjs/react-dom-server.node.development.js:3373:29)252 at Object.renderToString (C:/Projects/OSS/emotion/node_modules/react-dom/cjs/react-dom-server.node.development.js:3988:27)`253 expect(getLabelFromStackTrace(stackTrace)).toBe(expectedLabel)254 })255})256/**257 * E.g.258 *259 * ```260 * const test = {261 * MyComponent$9() {262 * return <div css={{ color: 'red' }}>red</div>263 * }264 * }265 *266 * function App() {267 * const el = test.MyComponent$9()268 *269 * return ...270 * }271 * ```272 */273describe('function component within object', () => {274 test('Chrome', () => {275 const stackTrace = `Error276 at createEmotionProps (emotion-element-6352414e.browser.esm.js?fcc6:142)277 at jsxDEV (emotion-react-jsx-dev-runtime.browser.esm.js?cf67:18)278 at Object.MyComponent$9 (index.js?bee7:7)279 at App (index.js?bee7:14)280 at renderWithHooks (react-dom.development.js?3c4a:14803)281 at mountIndeterminateComponent (react-dom.development.js?3c4a:17482)282 at beginWork (react-dom.development.js?3c4a:18596)283 at beginWork$1 (react-dom.development.js?3c4a:23179)`284 expect(getLabelFromStackTrace(stackTrace)).toBe(expectedLabel)285 })286 test('Firefox', () => {287 const stackTrace = `createEmotionProps@webpack-internal:///../../packages/react/dist/emotion-element-6352414e.browser.esm.js:163:40288jsxDEV@webpack-internal:///../../packages/react/jsx-dev-runtime/dist/emotion-react-jsx-dev-runtime.browser.esm.js:35:230289MyComponent$9@webpack-internal:///./pages/index.js:32:82290App@webpack-internal:///./pages/index.js:49:17291renderWithHooks@webpack-internal:///../../node_modules/react-dom/cjs/react-dom.development.js:14803:27292mountIndeterminateComponent@webpack-internal:///../../node_modules/react-dom/cjs/react-dom.development.js:17482:13293beginWork@webpack-internal:///../../node_modules/react-dom/cjs/react-dom.development.js:18596:16294beginWork$1@webpack-internal:///../../node_modules/react-dom/cjs/react-dom.development.js:23179:14`295 expect(getLabelFromStackTrace(stackTrace)).toBe(expectedLabel)296 })297 test('Safari', () => {298 // MyComponent$9 does not appear in the stack trace299 const stackTrace = `createEmotionProps@http://localhost:3000/static/js/main.chunk.js:866:49300jsxDEV@http://localhost:3000/static/js/main.chunk.js:1147:247301App@http://localhost:3000/static/js/main.chunk.js:2290:32302renderWithHooks@http://localhost:3000/static/js/vendors~main.chunk.js:19152:31303mountIndeterminateComponent@http://localhost:3000/static/js/vendors~main.chunk.js:21764:32304beginWork$1@http://localhost:3000/static/js/vendors~main.chunk.js:27384:27`305 expect(getLabelFromStackTrace(stackTrace)).toBe('App')306 })307 test('SSR', () => {308 const stackTrace = `Error309 at Object.createEmotionProps (webpack-internal:///../../packages/react/dist/emotion-element-7a9c77b4.cjs.dev.js:175:40)310 at jsxDEV (webpack-internal:///../../packages/react/jsx-dev-runtime/dist/emotion-react-jsx-dev-runtime.cjs.dev.js:22:75)311 at Object.MyComponent$9 (webpack-internal:///./pages/index.js:31:82)312 at App (webpack-internal:///./pages/index.js:47:19)313 at processChild (C:/Projects/OSS/emotion/node_modules/react-dom/cjs/react-dom-server.node.development.js:3043:14)314 at resolve (C:/Projects/OSS/emotion/node_modules/react-dom/cjs/react-dom-server.node.development.js:2960:5)315 at ReactDOMServerRenderer.render (C:/Projects/OSS/emotion/node_modules/react-dom/cjs/react-dom-server.node.development.js:3435:22)316 at ReactDOMServerRenderer.read (C:/Projects/OSS/emotion/node_modules/react-dom/cjs/react-dom-server.node.development.js:3373:29)317 at Object.renderToString (C:/Projects/OSS/emotion/node_modules/react-dom/cjs/react-dom-server.node.development.js:3988:27)318 at Object.renderPage (C:/Projects/OSS/emotion/node_modules/next/dist/server/render.js:621:45)`319 expect(getLabelFromStackTrace(stackTrace)).toBe(expectedLabel)320 })321})322test('Chrome: Module.jsx', () => {323 // From https://github.com/emotion-js/emotion/issues/1947324 const stackTrace = `Error325 at Module.jsx (http://localhost:10400/foo/bar/Combo?WZC6ZC&1ECYELF&12FP1RC&17F9LE8&P29J1Z&19IF3L2&AS09Z5&DHIG3C&EZJOER&13HZV70&1Y0F1JC&7UNIX3&SXHPTZ&K2YF13&11KMHHF&ZT36EV&Z44N8N&1QZW1DM&O16D0M&CW2QNS&1FH6TF2&ZWDLTF&1X87ICA&6LRWIZ&ME66AT&1SR9GT&1YH9ZQP&HHC8F2&1DB0VYO&FKOBET&1MJ8I38&JLAULY&1CH0G0Z&1TVRXYJ&SPNXDO&1JYOJGK&1LO9VOK&11TND7U&1YWNKYV&1DXWRM&TK6KOI&154ANPU&RWT5PA&19HGOKC&1YUJVCR&VFG0H0&172UQH&WFFZOK&1G8KK9P&Z4U2ZW&9UOM25&CBEUA3&1BURRUK&34VP40&CT8SCX&C5EGO8&XBSA9O&LL4E3N&1G5530W&R7QR2I&11ZITTG&1OIUGH1&ZN50OK&19R3ZDC&68ZZJF&413IE5&P0AYR7&1SMIEQU&1I34GN7&1GCT1EE&165FEOI&1NN6TMC&1FGT66H&1CP9Y2C&1R3WFPP&16Z97O3&1HGGWC2&AL9WFH&JXOSA2&QUXERX&NU7E4G&3HPVD3&16NVKFB&1JO5LOD&PIJWGC&1HD0KL3&A5KQ0E&UVG8ZT&156786I&1EGYRX&931PJP&71A44J&K4T5RR&YJS0J6&6NKXDV&15LGDNT&DK4XFH:6963:17)326 at MyComponent$9 (http://localhost:10400/foo/bar/Combo?WZC6ZC&1ECYELF&12FP1RC&17F9LE8&P29J1Z&19IF3L2&AS09Z5&DHIG3C&EZJOER&13HZV70&1Y0F1JC&7UNIX3&SXHPTZ&K2YF13&11KMHHF&ZT36EV&Z44N8N&1QZW1DM&O16D0M&CW2QNS&1FH6TF2&ZWDLTF&1X87ICA&6LRWIZ&ME66AT&1SR9GT&1YH9ZQP&HHC8F2&1DB0VYO&FKOBET&1MJ8I38&JLAULY&1CH0G0Z&1TVRXYJ&SPNXDO&1JYOJGK&1LO9VOK&11TND7U&1YWNKYV&1DXWRM&TK6KOI&154ANPU&RWT5PA&19HGOKC&1YUJVCR&VFG0H0&172UQH&WFFZOK&1G8KK9P&Z4U2ZW&9UOM25&CBEUA3&1BURRUK&34VP40&CT8SCX&C5EGO8&XBSA9O&LL4E3N&1G5530W&R7QR2I&11ZITTG&1OIUGH1&ZN50OK&19R3ZDC&68ZZJF&413IE5&P0AYR7&1SMIEQU&1I34GN7&1GCT1EE&165FEOI&1NN6TMC&1FGT66H&1CP9Y2C&1R3WFPP&16Z97O3&1HGGWC2&AL9WFH&JXOSA2&QUXERX&NU7E4G&3HPVD3&16NVKFB&1JO5LOD&PIJWGC&1HD0KL3&A5KQ0E&UVG8ZT&156786I&1EGYRX&931PJP&71A44J&K4T5RR&YJS0J6&6NKXDV&15LGDNT&DK4XFH:13679:15)327 at renderWithHooks (http://localhost:10400/foo/bar/Combo?1J6XZOQ&CV1G7Q&178CDN5&8GO7HW&1NEWTVK&11D8SWR&EUW1RW&B0SNY0&UKYKU8&Z2LJ32&OMFXIN&1CKRK5M&1DCE7I2&BTKQMZ&BF6IS9&IGMBPD&17GLBW0&F1NR3R&1BYJ6GK&1QMDI0S&1YBURTD&N3FA6J&1OKN2Q4&1VX6R8D&1RN5YOY&1PGEWZS&186NYSC&6OOHB&DAQXGM&18F8OG0&IEBF22&16BSJS0&270VGN&220EF0&PP2DW2&EXOH0W&1UI8QOX&BESS5A&SYNC6D&3EWNSZ&TX0EOZ&YHES22&SS37DN&155I4KT&SBSDY7&G2CFJM&1L12OEG&189382Y&4IWM93&RVOAXW&NMAEHJ&A3HW6D&react_v16.8.4&react-dom_v16.8.4&1I1OITG&1ZY465&1R86UXI&WLU3QX&1OO689&1N913EH&RZP360&15WCYOM&17TCHPC&115R68D&1VRCLJ7&12F8G3T&QXNNQC&128FRJB&1OH35FB&CHPVZ7&15VJLWF&DXTQHG&TI7NW9&8F7DFB&3ER51Q&1DTSSTA&1PQZ3V&1CA54WE&1GEM33A&OC7AMR&3AYWID&1KYS5DS&O76Y7S&1CD2C6F&1SB1JQ0&1DMMKMS&OCFDX4&1MO3710&1GVEDEZ&1FT6HVF&4JF9F9&1F8VFMW&1GAQQYW&149YUOT&12GEY49&4MFMGQ&16N8W14&12SV68C&2F7EYB&23HVSL&4TAXU8&1YL1F3&14H19K&1WHTWL7&1PYNLWK&1RUO08N&1PLVRSS&126YWXW&1TAPDE6&18TCRAP:78801:18)328 at updateFunctionComponent (http://localhost:10400/foo/bar/Combo?1J6XZOQ&CV1G7Q&178CDN5&8GO7HW&1NEWTVK&11D8SWR&EUW1RW&B0SNY0&UKYKU8&Z2LJ32&OMFXIN&1CKRK5M&1DCE7I2&BTKQMZ&BF6IS9&IGMBPD&17GLBW0&F1NR3R&1BYJ6GK&1QMDI0S&1YBURTD&N3FA6J&1OKN2Q4&1VX6R8D&1RN5YOY&1PGEWZS&186NYSC&6OOHB&DAQXGM&18F8OG0&IEBF22&16BSJS0&270VGN&220EF0&PP2DW2&EXOH0W&1UI8QOX&BESS5A&SYNC6D&3EWNSZ&TX0EOZ&YHES22&SS37DN&155I4KT&SBSDY7&G2CFJM&1L12OEG&189382Y&4IWM93&RVOAXW&NMAEHJ&A3HW6D&react_v16.8.4&react-dom_v16.8.4&1I1OITG&1ZY465&1R86UXI&WLU3QX&1OO689&1N913EH&RZP360&15WCYOM&17TCHPC&115R68D&1VRCLJ7&12F8G3T&QXNNQC&128FRJB&1OH35FB&CHPVZ7&15VJLWF&DXTQHG&TI7NW9&8F7DFB&3ER51Q&1DTSSTA&1PQZ3V&1CA54WE&1GEM33A&OC7AMR&3AYWID&1KYS5DS&O76Y7S&1CD2C6F&1SB1JQ0&1DMMKMS&OCFDX4&1MO3710&1GVEDEZ&1FT6HVF&4JF9F9&1F8VFMW&1GAQQYW&149YUOT&12GEY49&4MFMGQ&16N8W14&12SV68C&2F7EYB&23HVSL&4TAXU8&1YL1F3&14H19K&1WHTWL7&1PYNLWK&1RUO08N&1PLVRSS&126YWXW&1TAPDE6&18TCRAP:80490:19)329 at beginWork (http://localhost:10400/foo/bar/Combo?1J6XZOQ&CV1G7Q&178CDN5&8GO7HW&1NEWTVK&11D8SWR&EUW1RW&B0SNY0&UKYKU8&Z2LJ32&OMFXIN&1CKRK5M&1DCE7I2&BTKQMZ&BF6IS9&IGMBPD&17GLBW0&F1NR3R&1BYJ6GK&1QMDI0S&1YBURTD&N3FA6J&1OKN2Q4&1VX6R8D&1RN5YOY&1PGEWZS&186NYSC&6OOHB&DAQXGM&18F8OG0&IEBF22&16BSJS0&270VGN&220EF0&PP2DW2&EXOH0W&1UI8QOX&BESS5A&SYNC6D&3EWNSZ&TX0EOZ&YHES22&SS37DN&155I4KT&SBSDY7&G2CFJM&1L12OEG&189382Y&4IWM93&RVOAXW&NMAEHJ&A3HW6D&react_v16.8.4&react-dom_v16.8.4&1I1OITG&1ZY465&1R86UXI&WLU3QX&1OO689&1N913EH&RZP360&15WCYOM&17TCHPC&115R68D&1VRCLJ7&12F8G3T&QXNNQC&128FRJB&1OH35FB&CHPVZ7&15VJLWF&DXTQHG&TI7NW9&8F7DFB&3ER51Q&1DTSSTA&1PQZ3V&1CA54WE&1GEM33A&OC7AMR&3AYWID&1KYS5DS&O76Y7S&1CD2C6F&1SB1JQ0&1DMMKMS&OCFDX4&1MO3710&1GVEDEZ&1FT6HVF&4JF9F9&1F8VFMW&1GAQQYW&149YUOT&12GEY49&4MFMGQ&16N8W14&12SV68C&2F7EYB&23HVSL&4TAXU8&1YL1F3&14H19K&1WHTWL7&1PYNLWK&1RUO08N&1PLVRSS&126YWXW&1TAPDE6&18TCRAP:81500:13)330 at performUnitOfWork (http://localhost:10400/foo/bar/Combo?1J6XZOQ&CV1G7Q&178CDN5&8GO7HW&1NEWTVK&11D8SWR&EUW1RW&B0SNY0&UKYKU8&Z2LJ32&OMFXIN&1CKRK5M&1DCE7I2&BTKQMZ&BF6IS9&IGMBPD&17GLBW0&F1NR3R&1BYJ6GK&1QMDI0S&1YBURTD&N3FA6J&1OKN2Q4&1VX6R8D&1RN5YOY&1PGEWZS&186NYSC&6OOHB&DAQXGM&18F8OG0&IEBF22&16BSJS0&270VGN&220EF0&PP2DW2&EXOH0W&1UI8QOX&BESS5A&SYNC6D&3EWNSZ&TX0EOZ&YHES22&SS37DN&155I4KT&SBSDY7&G2CFJM&1L12OEG&189382Y&4IWM93&RVOAXW&NMAEHJ&A3HW6D&react_v16.8.4&react-dom_v16.8.4&1I1OITG&1ZY465&1R86UXI&WLU3QX&1OO689&1N913EH&RZP360&15WCYOM&17TCHPC&115R68D&1VRCLJ7&12F8G3T&QXNNQC&128FRJB&1OH35FB&CHPVZ7&15VJLWF&DXTQHG&TI7NW9&8F7DFB&3ER51Q&1DTSSTA&1PQZ3V&1CA54WE&1GEM33A&OC7AMR&3AYWID&1KYS5DS&O76Y7S&1CD2C6F&1SB1JQ0&1DMMKMS&OCFDX4&1MO3710&1GVEDEZ&1FT6HVF&4JF9F9&1F8VFMW&1GAQQYW&149YUOT&12GEY49&4MFMGQ&16N8W14&12SV68C&2F7EYB&23HVSL&4TAXU8&1YL1F3&14H19K&1WHTWL7&1PYNLWK&1RUO08N&1PLVRSS&126YWXW&1TAPDE6&18TCRAP:85175:11)331 at workLoop (http://localhost:10400/foo/bar/Combo?1J6XZOQ&CV1G7Q&178CDN5&8GO7HW&1NEWTVK&11D8SWR&EUW1RW&B0SNY0&UKYKU8&Z2LJ32&OMFXIN&1CKRK5M&1DCE7I2&BTKQMZ&BF6IS9&IGMBPD&17GLBW0&F1NR3R&1BYJ6GK&1QMDI0S&1YBURTD&N3FA6J&1OKN2Q4&1VX6R8D&1RN5YOY&1PGEWZS&186NYSC&6OOHB&DAQXGM&18F8OG0&IEBF22&16BSJS0&270VGN&220EF0&PP2DW2&EXOH0W&1UI8QOX&BESS5A&SYNC6D&3EWNSZ&TX0EOZ&YHES22&SS37DN&155I4KT&SBSDY7&G2CFJM&1L12OEG&189382Y&4IWM93&RVOAXW&NMAEHJ&A3HW6D&react_v16.8.4&react-dom_v16.8.4&1I1OITG&1ZY465&1R86UXI&WLU3QX&1OO689&1N913EH&RZP360&15WCYOM&17TCHPC&115R68D&1VRCLJ7&12F8G3T&QXNNQC&128FRJB&1OH35FB&CHPVZ7&15VJLWF&DXTQHG&TI7NW9&8F7DFB&3ER51Q&1DTSSTA&1PQZ3V&1CA54WE&1GEM33A&OC7AMR&3AYWID&1KYS5DS&O76Y7S&1CD2C6F&1SB1JQ0&1DMMKMS&OCFDX4&1MO3710&1GVEDEZ&1FT6HVF&4JF9F9&1F8VFMW&1GAQQYW&149YUOT&12GEY49&4MFMGQ&16N8W14&12SV68C&2F7EYB&23HVSL&4TAXU8&1YL1F3&14H19K&1WHTWL7&1PYNLWK&1RUO08N&1PLVRSS&126YWXW&1TAPDE6&18TCRAP:85215:22)332 at renderRoot (http://localhost:10400/foo/bar/Combo?1J6XZOQ&CV1G7Q&178CDN5&8GO7HW&1NEWTVK&11D8SWR&EUW1RW&B0SNY0&UKYKU8&Z2LJ32&OMFXIN&1CKRK5M&1DCE7I2&BTKQMZ&BF6IS9&IGMBPD&17GLBW0&F1NR3R&1BYJ6GK&1QMDI0S&1YBURTD&N3FA6J&1OKN2Q4&1VX6R8D&1RN5YOY&1PGEWZS&186NYSC&6OOHB&DAQXGM&18F8OG0&IEBF22&16BSJS0&270VGN&220EF0&PP2DW2&EXOH0W&1UI8QOX&BESS5A&SYNC6D&3EWNSZ&TX0EOZ&YHES22&SS37DN&155I4KT&SBSDY7&G2CFJM&1L12OEG&189382Y&4IWM93&RVOAXW&NMAEHJ&A3HW6D&react_v16.8.4&react-dom_v16.8.4&1I1OITG&1ZY465&1R86UXI&WLU3QX&1OO689&1N913EH&RZP360&15WCYOM&17TCHPC&115R68D&1VRCLJ7&12F8G3T&QXNNQC&128FRJB&1OH35FB&CHPVZ7&15VJLWF&DXTQHG&TI7NW9&8F7DFB&3ER51Q&1DTSSTA&1PQZ3V&1CA54WE&1GEM33A&OC7AMR&3AYWID&1KYS5DS&O76Y7S&1CD2C6F&1SB1JQ0&1DMMKMS&OCFDX4&1MO3710&1GVEDEZ&1FT6HVF&4JF9F9&1F8VFMW&1GAQQYW&149YUOT&12GEY49&4MFMGQ&16N8W14&12SV68C&2F7EYB&23HVSL&4TAXU8&1YL1F3&14H19K&1WHTWL7&1PYNLWK&1RUO08N&1PLVRSS&126YWXW&1TAPDE6&18TCRAP:85298:5)333 at performWorkOnRoot (http://localhost:10400/foo/bar/Combo?1J6XZOQ&CV1G7Q&178CDN5&8GO7HW&1NEWTVK&11D8SWR&EUW1RW&B0SNY0&UKYKU8&Z2LJ32&OMFXIN&1CKRK5M&1DCE7I2&BTKQMZ&BF6IS9&IGMBPD&17GLBW0&F1NR3R&1BYJ6GK&1QMDI0S&1YBURTD&N3FA6J&1OKN2Q4&1VX6R8D&1RN5YOY&1PGEWZS&186NYSC&6OOHB&DAQXGM&18F8OG0&IEBF22&16BSJS0&270VGN&220EF0&PP2DW2&EXOH0W&1UI8QOX&BESS5A&SYNC6D&3EWNSZ&TX0EOZ&YHES22&SS37DN&155I4KT&SBSDY7&G2CFJM&1L12OEG&189382Y&4IWM93&RVOAXW&NMAEHJ&A3HW6D&react_v16.8.4&react-dom_v16.8.4&1I1OITG&1ZY465&1R86UXI&WLU3QX&1OO689&1N913EH&RZP360&15WCYOM&17TCHPC&115R68D&1VRCLJ7&12F8G3T&QXNNQC&128FRJB&1OH35FB&CHPVZ7&15VJLWF&DXTQHG&TI7NW9&8F7DFB&3ER51Q&1DTSSTA&1PQZ3V&1CA54WE&1GEM33A&OC7AMR&3AYWID&1KYS5DS&O76Y7S&1CD2C6F&1SB1JQ0&1DMMKMS&OCFDX4&1MO3710&1GVEDEZ&1FT6HVF&4JF9F9&1F8VFMW&1GAQQYW&149YUOT&12GEY49&4MFMGQ&16N8W14&12SV68C&2F7EYB&23HVSL&4TAXU8&1YL1F3&14H19K&1WHTWL7&1PYNLWK&1RUO08N&1PLVRSS&126YWXW&1TAPDE6&18TCRAP:86205:5)334 at performWork (http://localhost:10400/foo/bar/Combo?1J6XZOQ&CV1G7Q&178CDN5&8GO7HW&1NEWTVK&11D8SWR&EUW1RW&B0SNY0&UKYKU8&Z2LJ32&OMFXIN&1CKRK5M&1DCE7I2&BTKQMZ&BF6IS9&IGMBPD&17GLBW0&F1NR3R&1BYJ6GK&1QMDI0S&1YBURTD&N3FA6J&1OKN2Q4&1VX6R8D&1RN5YOY&1PGEWZS&186NYSC&6OOHB&DAQXGM&18F8OG0&IEBF22&16BSJS0&270VGN&220EF0&PP2DW2&EXOH0W&1UI8QOX&BESS5A&SYNC6D&3EWNSZ&TX0EOZ&YHES22&SS37DN&155I4KT&SBSDY7&G2CFJM&1L12OEG&189382Y&4IWM93&RVOAXW&NMAEHJ&A3HW6D&react_v16.8.4&react-dom_v16.8.4&1I1OITG&1ZY465&1R86UXI&WLU3QX&1OO689&1N913EH&RZP360&15WCYOM&17TCHPC&115R68D&1VRCLJ7&12F8G3T&QXNNQC&128FRJB&1OH35FB&CHPVZ7&15VJLWF&DXTQHG&TI7NW9&8F7DFB&3ER51Q&1DTSSTA&1PQZ3V&1CA54WE&1GEM33A&OC7AMR&3AYWID&1KYS5DS&O76Y7S&1CD2C6F&1SB1JQ0&1DMMKMS&OCFDX4&1MO3710&1GVEDEZ&1FT6HVF&4JF9F9&1F8VFMW&1GAQQYW&149YUOT&12GEY49&4MFMGQ&16N8W14&12SV68C&2F7EYB&23HVSL&4TAXU8&1YL1F3&14H19K&1WHTWL7&1PYNLWK&1RUO08N&1PLVRSS&126YWXW&1TAPDE6&18TCRAP:86117:5)`335 expect(getLabelFromStackTrace(stackTrace)).toBe(expectedLabel)336})337/**338 * E.g.339 *340 * ```341 * const MyComponent$9 = React.forwardRef(function MyComponent$9() {342 * return <div css={{ color: 'red' }} />343 * })344 * ```345 */346describe('React.forwardRef with named function', () => {347 // forwardRef only changes the stack trace for SSR348 test('SSR', () => {349 const stackTrace = `Error350 at Object.createEmotionProps (webpack-internal:///../../packages/react/dist/emotion-element-7a9c77b4.cjs.dev.js:175:40)351 at jsxDEV (webpack-internal:///../../packages/react/jsx-dev-runtime/dist/emotion-react-jsx-dev-runtime.cjs.dev.js:22:75)352 at Object.MyComponent$9 [as render] (webpack-internal:///./pages/index.js:31:80)353 at ReactDOMServerRenderer.render (C:/Projects/OSS/emotion/node_modules/react-dom/cjs/react-dom-server.node.development.js:3535:44)354 at ReactDOMServerRenderer.read (C:/Projects/OSS/emotion/node_modules/react-dom/cjs/react-dom-server.node.development.js:3373:29)355 at Object.renderToString (C:/Projects/OSS/emotion/node_modules/react-dom/cjs/react-dom-server.node.development.js:3988:27)356 at Object.renderPage (C:/Projects/OSS/emotion/node_modules/next/dist/server/render.js:621:45)357 at Object.defaultGetInitialProps (C:/Projects/OSS/emotion/node_modules/next/dist/server/render.js:301:51)358 at Function.getInitialProps (webpack-internal:///../../node_modules/next/dist/pages/_document.js:187:16)359 at Object.loadGetInitialProps (C:/Projects/OSS/emotion/node_modules/next/dist/shared/lib/utils.js:69:29)`360 expect(getLabelFromStackTrace(stackTrace)).toBe(expectedLabel)361 })362})363/**364 * E.g. (put an @ in front of jsxImportSource if doing this for real)365 *366 * ```367 * // jsxImportSource theme-ui368 *369 * function MyComponent$9() {370 * return <div sx={{ color: 'red' }} />371 * }372 * ```373 *374 * See https://theme-ui.com/sx-prop.375 */376describe('multiple jsx factories', () => {377 test('Chrome', () => {378 const stackTrace = `Error379 at createEmotionProps (emotion-element-db00a197.browser.esm.js:78)380 at jsxDEV (emotion-react-jsx-dev-runtime.browser.esm.js:14)381 at jsxDEV (theme-ui-core-jsx-dev-runtime.esm.js:7)382 at MyComponent$9 (App.js:6)383 at renderWithHooks (react-dom.development.js:14803)384 at mountIndeterminateComponent (react-dom.development.js:17482)385 at beginWork (react-dom.development.js:18596)386 at beginWork$1 (react-dom.development.js:23179)`387 expect(getLabelFromStackTrace(stackTrace)).toBe(expectedLabel)388 })389 test('Firefox', () => {390 const stackTrace = `createEmotionProps@http://localhost:3000/static/js/main.chunk.js:771:40391jsxDEV@http://localhost:3000/static/js/main.chunk.js:942:247392jsxDEV@http://localhost:3000/static/js/vendors~main.chunk.js:3998:87393MyComponent$9@http://localhost:3000/static/js/main.chunk.js:2094:86394renderWithHooks@http://localhost:3000/static/js/vendors~main.chunk.js:21501:31395mountIndeterminateComponent@http://localhost:3000/static/js/vendors~main.chunk.js:24113:17396beginWork@http://localhost:3000/static/js/vendors~main.chunk.js:25191:20397beginWork$1@http://localhost:3000/static/js/vendors~main.chunk.js:29733:18`398 expect(getLabelFromStackTrace(stackTrace)).toBe(expectedLabel)399 })400 test('Safari', () => {401 const stackTrace = `createEmotionProps@http://localhost:3000/static/js/main.chunk.js:866:49402jsxDEV@http://localhost:3000/static/js/main.chunk.js:1147:247403MyComponent$9@http://localhost:3000/static/js/main.chunk.js:2277:86404renderWithHooks@http://localhost:3000/static/js/vendors~main.chunk.js:19627:31405mountIndeterminateComponent@http://localhost:3000/static/js/vendors~main.chunk.js:22239:32406beginWork$1@http://localhost:3000/static/js/vendors~main.chunk.js:27859:27`407 expect(getLabelFromStackTrace(stackTrace)).toBe(expectedLabel)408 })409 test('SSR', () => {410 const stackTrace = `Error411 at Object.createEmotionProps (C:/Projects/OSS/emotion/packages/react/dist/emotion-element-7a9c77b4.cjs.dev.js:175:40)412 at Object.jsxDEV (C:/Projects/OSS/emotion/packages/react/jsx-dev-runtime/dist/emotion-react-jsx-dev-runtime.cjs.dev.js:22:75)413 at jsxDEV (C:/Projects/OSS/emotion/playgrounds/nextjs/node_modules/@theme-ui/core/jsx-dev-runtime/dist/theme-ui-core-jsx-dev-runtime.cjs.dev.js:15:24)414 at MyComponent$9 (webpack-internal:///./pages/index.js:64:79)415 at processChild (C:/Projects/OSS/emotion/playgrounds/nextjs/node_modules/react-dom/cjs/react-dom-server.node.development.js:3043:14)416 at resolve (C:/Projects/OSS/emotion/playgrounds/nextjs/node_modules/react-dom/cjs/react-dom-server.node.development.js:2960:5)417 at ReactDOMServerRenderer.render (C:/Projects/OSS/emotion/playgrounds/nextjs/node_modules/react-dom/cjs/react-dom-server.node.development.js:3435:22)418 at ReactDOMServerRenderer.read (C:/Projects/OSS/emotion/playgrounds/nextjs/node_modules/react-dom/cjs/react-dom-server.node.development.js:3373:29)419 at Object.renderToString (C:/Projects/OSS/emotion/playgrounds/nextjs/node_modules/react-dom/cjs/react-dom-server.node.development.js:3988:27)420 at Object.renderPage (C:/Projects/OSS/emotion/playgrounds/nextjs/node_modules/next/dist/server/render.js:621:45)`421 expect(getLabelFromStackTrace(stackTrace)).toBe(expectedLabel)422 })423 // From https://github.com/emotion-js/emotion/pull/1714#discussion_r365518850424 test('dollar signs in jsx', () => {425 const stackTrace = `jsx@http://localhost:3000/_next/static/development/pages/theme_ui.js?ts=1578745166666:440:17426jsx$$1@http://localhost:3000/_next/static/development/pages/theme_ui.js?ts=1578745166666:2777:60427MyComponent$9@http://localhost:3000/_next/static/development/pages/theme_ui.js?ts=1578745166666:23:62428renderWithHooks@http://localhost:3000/_next/static/development/dll/dll_d6a88dbe3071bd165157.js?ts=1578745166666:16511:27429mountIndeterminateComponent@http://localhost:3000/_next/static/development/dll/dll_d6a88dbe3071bd165157.js?ts=1578745166666:19045:13`430 expect(getLabelFromStackTrace(stackTrace)).toBe(expectedLabel)431 })432})433/**434 * E.g.435 *436 * ```437 * class MyComponent$9 extends React.Component {438 * render() {439 * return <div css={{ color: 'red' }} />440 * }441 * }442 * ```443 */444describe('class component', () => {445 test('Chrome', () => {446 const stackTrace = `Error447 at createEmotionProps (emotion-element-6352414e.browser.esm.js:142)448 at jsxDEV (emotion-react-jsx-dev-runtime.browser.esm.js:18)449 at MyComponent$9.render (App.js:6)450 at finishClassComponent (react-dom.development.js:17163)451 at updateClassComponent (react-dom.development.js:17110)452 at beginWork (react-dom.development.js:18620)453 at beginWork$1 (react-dom.development.js:23179)`454 expect(getLabelFromStackTrace(stackTrace)).toBeUndefined()455 })456 test('Firefox', () => {457 const stackTrace = `createEmotionProps@http://localhost:3000/static/js/main.chunk.js:844:40458jsxDEV@http://localhost:3000/static/js/main.chunk.js:1125:247459render@http://localhost:3000/static/js/main.chunk.js:2276:89460finishClassComponent@http://localhost:3000/static/js/vendors~main.chunk.js:23777:22461updateClassComponent@http://localhost:3000/static/js/vendors~main.chunk.js:23727:48462beginWork@http://localhost:3000/static/js/vendors~main.chunk.js:25187:20463beginWork$1@http://localhost:3000/static/js/vendors~main.chunk.js:29705:18`464 expect(getLabelFromStackTrace(stackTrace)).toBeUndefined()465 })466 test('Safari', () => {467 // render does not appear in the stack trace468 const stackTrace = `createEmotionProps@http://localhost:3000/static/js/main.chunk.js:866:49469jsxDEV@http://localhost:3000/static/js/main.chunk.js:1147:247470finishClassComponent@http://localhost:3000/static/js/vendors~main.chunk.js:21453:41471updateClassComponent@http://localhost:3000/static/js/vendors~main.chunk.js:21406:48472beginWork$1@http://localhost:3000/static/js/vendors~main.chunk.js:27384:27`473 expect(getLabelFromStackTrace(stackTrace)).toBeUndefined()474 })475 test('SSR', () => {476 const stackTrace = `Error477 at Object.createEmotionProps (C:/Projects/OSS/emotion/packages/react/dist/emotion-element-7a9c77b4.cjs.dev.js:175:40)478 at Object.jsxDEV (C:/Projects/OSS/emotion/packages/react/jsx-dev-runtime/dist/emotion-react-jsx-dev-runtime.cjs.dev.js:22:75)479 at jsxDEV (C:/Projects/OSS/emotion/playgrounds/nextjs/node_modules/@theme-ui/core/jsx-dev-runtime/dist/theme-ui-core-jsx-dev-runtime.cjs.dev.js:15:24)480 at MyComponent$9.render (webpack-internal:///./pages/index.js:40:76)481 at processChild (C:/Projects/OSS/emotion/playgrounds/nextjs/node_modules/react-dom/cjs/react-dom-server.node.development.js:3134:18)482 at resolve (C:/Projects/OSS/emotion/playgrounds/nextjs/node_modules/react-dom/cjs/react-dom-server.node.development.js:2960:5)483 at ReactDOMServerRenderer.render (C:/Projects/OSS/emotion/playgrounds/nextjs/node_modules/react-dom/cjs/react-dom-server.node.development.js:3435:22)484 at ReactDOMServerRenderer.read (C:/Projects/OSS/emotion/playgrounds/nextjs/node_modules/react-dom/cjs/react-dom-server.node.development.js:3373:29)485 at Object.renderToString (C:/Projects/OSS/emotion/playgrounds/nextjs/node_modules/react-dom/cjs/react-dom-server.node.development.js:3988:27)486 at Object.renderPage (C:/Projects/OSS/emotion/playgrounds/nextjs/node_modules/next/dist/server/render.js:621:45)`487 expect(getLabelFromStackTrace(stackTrace)).toBeUndefined()488 })489})490/**491 * E.g.492 *493 * ```494 * import React from 'react'495 *496 * var __extends =497 * (this && this.__extends) ||498 * (function () {499 * var extendStatics = function (d, b) {500 * extendStatics =501 * Object.setPrototypeOf ||502 * ({ __proto__: [] } instanceof Array &&503 * function (d, b) {504 * d.__proto__ = b505 * }) ||506 * function (d, b) {507 * for (var p in b)508 * if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]509 * }510 * return extendStatics(d, b)511 * }512 * return function (d, b) {513 * extendStatics(d, b)514 * function __() {515 * this.constructor = d516 * }517 * d.prototype =518 * b === null ? Object.create(b) : ((__.prototype = b.prototype), new __())519 * }520 * })()521 *522 * export const MyComponent$9 = (function (_super) {523 * __extends(MyComponent$9, _super)524 * function MyComponent$9() {525 * var _this = (_super !== null && _super.apply(this, arguments)) || this526 * return _this527 * }528 * MyComponent$9.prototype.render = function () {529 * // Defining a variable to prevent Proper Tail Call530 * const el = <div css={{ color: 'red' }} />531 * return el532 * }533 * return MyComponent$9534 * })(React.PureComponent)535 * ```536 */537describe('class component transpiled to ES 5', () => {538 test('Chrome', () => {539 const stackTrace = `Error540 at createEmotionProps (emotion-element-10a9af6f.browser.esm.js?d0a2:168)541 at jsxDEV (emotion-react-jsx-dev-runtime.browser.esm.js?cf67:18)542 at MyComponent$9.render (MyComponent9.js?2fbf:37)543 at finishClassComponent (react-dom.development.js?3c4a:17160)544 at updateClassComponent (react-dom.development.js?3c4a:17110)545 at beginWork (react-dom.development.js?3c4a:18620)546 at beginWork$1 (react-dom.development.js?3c4a:23179)547 at performUnitOfWork (react-dom.development.js?3c4a:22154)548 at workLoopSync (react-dom.development.js?3c4a:22130)549 at performSyncWorkOnRoot (react-dom.development.js?3c4a:21756)`550 expect(getLabelFromStackTrace(stackTrace)).toBeUndefined()551 })552 test('Firefox', () => {553 const stackTrace = `createEmotionProps@webpack-internal:///../../packages/react/dist/emotion-element-10a9af6f.browser.esm.js:189:42554jsxDEV@webpack-internal:///../../packages/react/jsx-dev-runtime/dist/emotion-react-jsx-dev-runtime.browser.esm.js:35:230555MyComponent$9</MyComponent$9.prototype.render@webpack-internal:///./pages/MyComponent9.js:62:82556finishClassComponent@webpack-internal:///../../node_modules/react-dom/cjs/react-dom.development.js:17163:18557updateClassComponent@webpack-internal:///../../node_modules/react-dom/cjs/react-dom.development.js:17110:44558beginWork@webpack-internal:///../../node_modules/react-dom/cjs/react-dom.development.js:18620:16559beginWork$1@webpack-internal:///../../node_modules/react-dom/cjs/react-dom.development.js:23179:14560performUnitOfWork@webpack-internal:///../../node_modules/react-dom/cjs/react-dom.development.js:22154:12561workLoopSync@webpack-internal:///../../node_modules/react-dom/cjs/react-dom.development.js:22130:22`562 expect(getLabelFromStackTrace(stackTrace)).toBeUndefined()563 })564 test('Safari', () => {565 // No idea why the function name is just blank in this stack trace566 const stackTrace = `createEmotionProps@http://localhost:3000/static/js/main.chunk.js:973:49567jsxDEV@http://localhost:3000/static/js/main.chunk.js:1609:247568@http://localhost:3000/static/js/main.chunk.js:2926:93569finishClassComponent@http://localhost:3000/static/js/vendors~main.chunk.js:21433:41570updateClassComponent@http://localhost:3000/static/js/vendors~main.chunk.js:21386:48571beginWork$1@http://localhost:3000/static/js/vendors~main.chunk.js:27364:27572performUnitOfWork@http://localhost:3000/static/js/vendors~main.chunk.js:26352:27573workLoopSync@http://localhost:3000/static/js/vendors~main.chunk.js:26328:43574performSyncWorkOnRoot@http://localhost:3000/static/js/vendors~main.chunk.js:25946:25`575 expect(getLabelFromStackTrace(stackTrace)).toBeUndefined()576 })577 test('SSR', () => {578 const stackTrace = `Error579 at Object.createEmotionProps (webpack-internal:///../../packages/react/dist/emotion-element-491a37fd.cjs.dev.js:201:42)580 at jsxDEV (webpack-internal:///../../packages/react/jsx-dev-runtime/dist/emotion-react-jsx-dev-runtime.cjs.dev.js:22:75)581 at MyComponent$9.render (webpack-internal:///./pages/MyComponent9.js:60:82)582 at processChild (/Users/sammagura/Documents/emotion/node_modules/react-dom/cjs/react-dom-server.node.development.js:3134:18)583 at resolve (/Users/sammagura/Documents/emotion/node_modules/react-dom/cjs/react-dom-server.node.development.js:2960:5)584 at ReactDOMServerRenderer.render (/Users/sammagura/Documents/emotion/node_modules/react-dom/cjs/react-dom-server.node.development.js:3435:22)585 at ReactDOMServerRenderer.read (/Users/sammagura/Documents/emotion/node_modules/react-dom/cjs/react-dom-server.node.development.js:3373:29)586 at Object.renderToString (/Users/sammagura/Documents/emotion/node_modules/react-dom/cjs/react-dom-server.node.development.js:3988:27)587 at Object.renderPage (/Users/sammagura/Documents/emotion/node_modules/next/dist/server/render.js:621:45)588 at Object.defaultGetInitialProps (/Users/sammagura/Documents/emotion/node_modules/next/dist/server/render.js:301:51)`589 expect(getLabelFromStackTrace(stackTrace)).toBeUndefined()590 })591})592/**593 * https://github.com/emotion-js/emotion/issues/2614594 *595 * Not sure how to reproduce this other than this repro project:596 * https://github.com/srmagura/emotion-issue-2614597 */598describe('issue #2614 - class component transpiled to ES 5', () => {599 test('Chrome', () => {600 const stackTrace = `Error601 at createEmotionProps (webpack-internal:///./node_modules/@emotion/react/dist/emotion-element-699e6908.browser.esm.js:183)602 at Module.jsx (webpack-internal:///./node_modules/@emotion/react/dist/emotion-react.browser.esm.js:127)603 at Loader.render (webpack-internal:///./node_modules/react-spinners/ScaleLoader.js:56)604 at finishClassComponent (webpack-internal:///./node_modules/react-dom/cjs/react-dom.development.js:17485)605 at updateClassComponent (webpack-internal:///./node_modules/react-dom/cjs/react-dom.development.js:17435)606 at beginWork (webpack-internal:///./node_modules/react-dom/cjs/react-dom.development.js:19073)607 at beginWork$1 (webpack-internal:///./node_modules/react-dom/cjs/react-dom.development.js:23935)608 at performUnitOfWork (webpack-internal:///./node_modules/react-dom/cjs/react-dom.development.js:22771)609 at workLoopSync (webpack-internal:///./node_modules/react-dom/cjs/react-dom.development.js:22702)610 at renderRootSync (webpack-internal:///./node_modules/react-dom/cjs/react-dom.development.js:22665)`611 expect(getLabelFromStackTrace(stackTrace)).toBeUndefined()612 })613 test('Firefox', () => {614 const stackTrace = `createEmotionProps@webpack-internal:///./node_modules/@emotion/react/dist/emotion-element-699e6908.browser.esm.js:183:40615jsx@webpack-internal:///./node_modules/@emotion/react/dist/emotion-react.browser.esm.js:127:105616Loader.prototype.render@webpack-internal:///./node_modules/react-spinners/ScaleLoader.js:56:35617finishClassComponent@webpack-internal:///./node_modules/react-dom/cjs/react-dom.development.js:17485:31618updateClassComponent@webpack-internal:///./node_modules/react-dom/cjs/react-dom.development.js:17435:44619beginWork@webpack-internal:///./node_modules/react-dom/cjs/react-dom.development.js:19073:16620beginWork$1@webpack-internal:///./node_modules/react-dom/cjs/react-dom.development.js:23935:14621performUnitOfWork@webpack-internal:///./node_modules/react-dom/cjs/react-dom.development.js:22771:12622workLoopSync@webpack-internal:///./node_modules/react-dom/cjs/react-dom.development.js:22702:22`623 expect(getLabelFromStackTrace(stackTrace)).toBeUndefined()624 })625 test('Safari', () => {626 // No idea why the function name is blank and there are no file locations627 const stackTrace = `createEmotionProps@628jsx@629@630finishClassComponent@631updateClassComponent@632beginWork$1@633performUnitOfWork@634workLoopSync@635renderRootSync@636performSyncWorkOnRoot@637scheduleUpdateOnFiber@638updateContainer@`639 expect(getLabelFromStackTrace(stackTrace)).toBeUndefined()640 })641 // No SSR stack trace since this comes from a Gatsby project...
fiber.js
Source: fiber.js
...121 * 122 * æ ¹æ® current === null ? å¤ææ¯ mount è¿æ¯ update123 * 124 * // react-dom125 * beginWork(current, workInProgress)126 * HostRoot (æ host å°±æ¯åç dom) #root127 * App128 * 深度ä¼å
éåè¿ç¨ï¼å½ workInProgress èç¹æ²¡æåèç¹ æéåå®ææåèç¹åä¼è¿å
¥ completeWork129 * 没æåèç¹ï¼å»ç¸é»å
å¼èç¹ beginWork-completeWork130 * å
å¼èç¹é½ç»æåï¼å»ç¶èç¹ completeWork131 * *注æï¼å½èç¹åªæä¸ä¸ªææ¬åèç¹æ¶ä¸ä¼çæèªå·±ç fiber èç¹132 * 133 * 134 * beginWork å
é¨æ§è¡æ¹æ³ï¼135 * updateHostComponent136 * reconcileChildren æ è®° effectTag137 * mountChildFibers = ChildReconciler(false) // ä¸å effectTag æ è®°138 * reconcileChildFibers = ChildReconciler(true) // å»å effectTag æ è®°139 * * diff ç®æ³æ¯å¨è¿ä½ç¨çï¼ç¨äºçæ effectTag [update]ï¼[mount]é¶æ®µæ¯æ diff && effectTag ç...
informQC.js
Source: informQC.js
...57 p.find("#memo_color").html(n.memo_color);58 p.find("#memo_other").html(n.memo_other);59 p.find("#sendInformQC").attr("onclick","sendInformQC(this)");60 if(n.status == "0"){61 p.find("#beginWork").attr("onclick","beginWork(this)");62 }else{63 p.find("#beginWork").html(n.status_trans+"...");64 p.find("#beginWork").attr("disabled",true);65 }66 props.append(p);67 });68 }69};7071//éç¥è´¨æ£72var sendInformQC = function(data){73 var dom = $(data).parent();74 var seeds_id = dom.find("#seeds_id").html();75 var PH = dom.find("#PH").html();
...
App.js
Source: App.js
1import React from 'react';2import './App.css';3import 'bootstrap/dist/css/bootstrap.min.css';4import Maincontent from './components/Maincontent/Maincontent';5import Outgoing from './components/Outgoing/Outgoing';6import AddnewDocContainer from './components/AddNewDocument/AddNewDocumentContainer';7import InfoAboutDocumentContainer from './components/Maincontent/InfoAboutDocument/InfoAboutDocumentContainer'8import BeginWork from './components/BeginWork/BeginWork'9import CreateTask from './components/CreateTask/CreateTaskContainer'10import LoginPageContainer from './components/LoginPage/LoginPageContainer'11import InfoAboutDocumentOutgoingContainer from './components/Outgoing/InfoAboutDocumentOutgoing/InfoAboutDocumentOutgoingContainer'12import InfoUser from './components/InfoUser/InfoUser'13import Help from './components/Help/Help';14import MyTasks from './components/MyTasks/MyTasks'15import {Route,BrowserRouter} from 'react-router-dom'16function App(props){17 const additionalInfIncoming = new RegExp('incoming/\\w+');18 const additionalInfOutgoing = new RegExp('outgoing/\\w+');19 return (20 <BrowserRouter>21 <div className="App">22 <Route path = {additionalInfOutgoing} render = {() => <InfoAboutDocumentOutgoingContainer dispatch = {props.dispatch} documents = {props.state.newDocsReducer.table} statusAction={props.state.newDocsReducer.statusAction} userInSystem={props.state.userReducer.userInSystem}/>}/>23 <Route path = {additionalInfIncoming} render = {() => <InfoAboutDocumentContainer documents = {props.state.newDocsReducer.table} dispatch = {props.dispatch} statusAction={props.state.newDocsReducer.statusAction} userInSystem={props.state.userReducer.userInSystem}/>}/>24 <Route exact path ="/" render = {()=> <BeginWork userInSystem = {props.state.userReducer.userInSystem}/>}/>25 <Route exact path ="/info" render = {()=> <InfoUser dispatch = {props.dispatch} userInSystem = {props.state.userReducer.userInSystem} />}/>26 <Route exact path ="/login" render = {()=> <LoginPageContainer dispatch = {props.dispatch} usersData = {props.state.userReducer} />}/>27 <Route exact path ="/help" render = {() => <Help userInSystem = {props.state.userReducer.userInSystem} dispatch = {props.dispatch}/>}/>28 <Route exact path ='/incoming' render = { () => <Maincontent dispatch = {props.dispatch} table = {props.state.newDocsReducer.table} userInSystem = {props.state.userReducer.userInSystem} inputValue= {props.state.newDocsReducer.inputToFind} sorted = {props.state.newDocsReducer.sorted} themeToFind = {props.state.newDocsReducer.themeToFind}/>}/>29 <Route exact path ='/outgoing' render = {() => <Outgoing dispatch = {props.dispatch} table = {props.state.newDocsReducer.table} userInSystem = {props.state.userReducer.userInSystem} inputValue= {props.state.newDocsReducer.inputToFind} sorted = {props.state.newDocsReducer.sorted} themeToFind = {props.state.newDocsReducer.themeToFind}/>} />30 <Route exact path ='/create' render = { () => <AddnewDocContainer dispatch = {props.dispatch} userInSystem = {props.state.userReducer.userInSystem} newDocument ={props.state.newDocsReducer.newDocument} statusAction={props.state.newDocsReducer.statusAction} tasks={props.state.tasksReducer.tasks} names = {props.state.userReducer.names}/>}/>31 <Route exact path ='/tasks' render = {() => <MyTasks myTasks = {props.state.tasksReducer} dispatch ={props.dispatch} userInSystem ={props.state.userReducer.userInSystem}/>}/>32 <Route exact path ="/createTask" render = {()=> <CreateTask newTask = {props.state.tasksReducer.newTask} dispatch = {props.dispatch} userInSystem = {props.state.userReducer.userInSystem} names = {props.state.userReducer.names} status ={props.state.tasksReducer.status}/>}/>33 </div>34 </BrowserRouter>35 )36}...
scheduleCtrl.js
Source: scheduleCtrl.js
1const Schedule = require('../models/scheduleModel');2const User = require('../models/userModel');3const scheduleCtrl = {4/////////////////////////////////////////// INSERT SCHEDULE ////////////////////////////////////////////5 addSchedule: async (req, res) => {6 try {7 const { day, beginWork, endWork,restFrom, restTo} = req.body;8 const user = req.user.id9 let schedule = await Schedule.create({ // creating schedule10 day, beginWork, endWork,restFrom,restTo, user11 });12 await User.findOneAndUpdate(req.user.id, { // adding schedule id to User collection13 $push: { schedule: schedule._id }14 });15 res.status(200).json({ success: true, msg:"Schedule added Successfully" });16 17 } catch (err) {18 return res.status(500).json({ msg: err.message })19 }20 },21/////////////////////////////////////////// UPDATE SCHEDULE ////////////////////////////////////////////22 editSchedule: async (req, res) => {23 try {24 const { day, beginWork, endWork,restFrom,restTo } = req.body;25 const updateFields = [];26 if (day) updateFields.day = day;27 if (beginWork) updateFields.beginWork = beginWork;28 if (endWork) updateFields.endWork = endWork;29 if (restFrom) updateFields.restFrom = restFrom;30 if (restTo) updateFields.restTo = restTo;31 const schedule = await Schedule.findByIdAndUpdate(req.params.id, { // pushing updates32 $set: { ...updateFields } 33 },34 {35 new: true, runValidators: true36 })37 res.status(200).json({success:true,msg:" Schedule Updated Successfully"})38 39 } catch (err) {40 return res.statue(500).json({ msg: err.message });41 }42 },43/////////////////////////////////////////// DELETING SCHEDULE ////////////////////////////////////////////44 deleteSchedule : async (req,res) =>{45 try {46 const schedule = await Schedule.findById(req.params.id);47 if(!schedule) return res.status(404).json({msg:"Schedule Not Found"});48 await User.findByIdAndDelete(req.user.id,{49 $pull :{schedule : req.params.id}50 })51 await schedule.remove(); // removing schedule from database52 res.status(200).json({msg:"Schedule successfully deleted"})53 54 } catch (err) {55 return res.status(500).json({msg:err.message});56 }57 },58/////////////////////////////////////////// SCHEDULE INFORMATION ////////////////////////////////////////////59 getSchedule : async (req,res) =>{60 try {61 const schedule = await Schedule.find({user:req.user.id}); // find all schedules with user id62 res.status(200).json({schedule});63 } catch (err) {64 return res.status(500).json({msg:err.message});65 }66 }67}...
3.fiber.js
Source: 3.fiber.js
...49 requestIdleCallback(workLoop, { timeout: 1000 })50 }51}52function performUnitOfWork(fiber) {53 beginWork(fiber);//å¤ç54 if (fiber.child) {55 return fiber.child;56 }57 while (fiber) {58 completeUnitOfWork(fiber);59 if (fiber.sibling) {60 return fiber.siblingW61 }62 fiber = fiber.return;63 }64 // while(fiber){65 // if(fiber.sibling){66 // return fiber.sibling;67 // }68 // completeUnitOfWork(fiber);69 // fiber = fiber.return70 // }71 // completeUnitOfWork(fiber);72 // if (fiber.sibling) {73 // return fiber.sibling;74 // }75 // fiber = fiber.return;76 // completeUnitOfWork(fiber);77 // if (fiber.sibling) {78 // return fiber.sibling;79 // }80}81function completeUnitOfWork(fiber) {82 console.log('ç»æ', fiber.key)83}84function beginWork(fiber) {85 console.log('å¼å§', fiber.key);86 // sleep(20);87}88nextUnitOfWork = rootFiber;89// requestIdleCallback(workLoop,{timeout:1000})90workLoop();91function sleep(d) {92 let start = Date.now();93 while (Date.now() - start <= d) {94 }95}96// function performUnitOfWork(fiber) {97// beginWork(fiber);//å¤ç98// if (fiber.child) {99// return fiber.child;100// }101// completeUnitOfWork(fiber);102// while(fiber){103// if(fiber.sibling){104// return fiber.sibling;105// }106// fiber = fiber.return;107// completeUnitOfWork(fiber);108// if(fiber.sibling){109// return fiber.sibling;110// }111// return;...
ReactFiberWorkLoop.js
Source: ReactFiberWorkLoop.js
...26}27function performUnitOfWork(unitOfWork) {28 debugger29 var current = unitOfWork.alternate;30 return beginWork(current, unitOfWork)31}32function workLoop() {33 while (workInProgress !== null) {34 workInProgress = performUnitOfWork(workInProgress)35 }36}37export function render(fiber) {38 workInProgress = fiber39 workLoop()40}41function reconcileChildren(current, workInProgress, children) {42 let childFiber = {43 tag: HostComponent,44 type: children.type,...
worker.js
Source: worker.js
...13 });14 let instance = app(config);15 instance.on('ready', beginWork);16 process.on('SIGTERM', shutdown);17 function beginWork() {18 instance.on('lost', shutdown);19 instance.startScraping();20 }21 function shutdown() {22 logger.log({type: 'info', msg: 'shutting down'});23 process.exit();24 }...
Using AI Code Generation
1const { chromium } = require('playwright');2(async () => {3 const browser = await chromium.launch();4 const context = await browser.newContext();5 const page = await context.newPage();6 await page.click('text=Get Started');7 await page.click('text=Docs');8 await page.click('text=API');
Using AI Code Generation
1const { chromium } = require('playwright');2(async () => {3 const browser = await chromium.launch();4 const context = await browser.newContext();5 const page = await context.newPage();6 const internal = page._delegate;7 const frame = internal._mainFrame;8 const work = internal._beginWork(frame);9 console.log(work);10 await internal._runAbortableTask(async () => {11 await work;12 });13})();14Promise { <pending> }
Using AI Code Generation
1const { chromium } = require('playwright');2const { beginWork } = require('playwright/lib/server/browserType');3(async () => {4 const browser = await chromium.launch();5 const context = await browser.newContext();6 const page = await context.newPage();7 await beginWork(page, {8 });9 await page.screenshot({ path: 'google.png' });10 await browser.close();11})();12### `beginWork(page: Page, options: BeginWorkOptions): Promise<void>`
Using AI Code Generation
1const { beginWork } = require('playwright/lib/server/browserType');2const { chromium } = require('playwright');3(async () => {4 const browser = await chromium.launch();5 const context = await browser.newContext();6 const page = await context.newPage();7 const [worker] = await Promise.all([8 page.waitForEvent('worker'),9 page.evaluate(() => new Worker(URL.createObjectURL(new Blob([`10 self.addEventListener('message', event => {11 self.postMessage(event.data);12 });13 ]);14 const result = await beginWork({15 });16 await browser.close();17})();18const { beginWork } = require('playwright/lib/server/browserType');19const { chromium } = require('playwright');20(async () => {21 const browser = await chromium.launch();22 const context = await browser.newContext();23 const page = await context.newPage();24 const [worker] = await Promise.all([25 page.waitForEvent('worker'),26 page.evaluate(() => new Worker(URL.createObjectURL(new Blob([`27 self.addEventListener('message', event => {28 self.postMessage(event.data);29 });30 ]);31 const result = await beginWork({32 });33 await browser.close();34})();
Using AI Code Generation
1const { beginWork } = require('playwright/lib/server/supplements/recorder/recorderSupplement');2const { beginWork } = require('playwright/lib/server/supplements/recorder/recorderSupplement');3const { beginWork } = require('playwright/lib/server/supplements/recorder/recorderSupplement');4const { beginWork } = require('playwright/lib/server/supplements/recorder/recorderSupplement');5const { beginWork } = require('playwright/lib/server/supplements/recorder/recorderSupplement');6const { beginWork } = require('playwright/lib/server/supplements/recorder/recorderSupplement');7const { beginWork } = require('playwright/lib/server/supplements/recorder/recorderSupplement');
Using AI Code Generation
1const { beginWork } = require('playwright/lib/server/supplements/recorder/recorderSupplement');2const { Page } = require('playwright/lib/server/page');3const { ElementHandle } = require('playwright/lib/server/frames');4const page = await context.newPage();5const { recorder } = await beginWork(context, page);6const selector = 'text="Click me"';7const handle = await page.$(selector);8await recorder.recordAction('click', handle, {});9const page = await context.newPage();10const { recorder } = await beginWork(context, page);11const page = await context.newPage();12const { recorder } = await beginWork(context, page);13await recorder.recordAction('press', page, { key: 'ArrowRight' });14const page = await context.newPage();15const { recorder } = await beginWork(context, page);16await recorder.recordAction('select', page, { value: 'blue' });17const page = await context.newPage();18const { recorder } = await beginWork(context, page);19await recorder.recordAction('check', page, { checked: true });20const page = await context.newPage();21const { recorder } = await beginWork(context, page);22await recorder.recordAction('uncheck', page, { checked: false });23const page = await context.newPage();24const { recorder } = await beginWork(context, page);25await recorder.recordAction('fill', page, { value: 'John Doe' });26const page = await context.newPage();27const { recorder } = await beginWork(context, page);28await recorder.recordAction('setInputFiles', page, { files: ['file1.txt', 'file2.txt'] });29const page = await context.newPage();30const { recorder } = await beginWork(context, page
Using AI Code Generation
1const { beginWork } = require('playwright/lib/server/trace/recorder');2const { chromium } = require('playwright');3(async () => {4 const browser = await chromium.launch();5 const page = await browser.newPage();6 await beginWork(page, 'trace.zip');7 await page.close();8 await browser.close();9})();
Using AI Code Generation
1const { beginWork } = require('playwright/lib/server/supplements/recorder/recorderSupplement');2const { context } = require('playwright/lib/server/chromium/crBrowser');3const { chromium } = require('playwright');4const fs = require('fs');5(async () => {6 const browser = await chromium.launch();7 const page = await browser.newPage();8 const context = page.context();9 const recorder = beginWork(context, {10 });11 await page.click('text=Get started');12 await page.click('text=Docs');13 await page.click('text=API');14 await page.click('text=Browser');15 await page.click('text=BrowserContext');16 await page.click('text=BrowserType');17 await page.click('text=Page');18 await page.click('text=Frame');19 await page.click('text=ElementHandle');20 await page.click('text=JSHandle');21 await page.click('text=Request');22 await page.click('text=Response');23 await page.click('text=Route');24 await page.click('text=Worker');25 await page.click('text=ConsoleMessage');26 await page.click('text=Dialog');27 await page.click('text=Download');28 await page.click('text=WebSocket');29 await page.click('text=TimeoutError');30 await page.click('text=Selectors');31 await page.click('text=Accessibility');
Using AI Code Generation
1const { beginWork } = require('playwright/lib/utils/worker');2const { BrowserContext } = require('playwright/lib/server/chromium/crBrowser');3const { launch } = require('playwright');4const browser = await launch();5const context = await browser.newContext();6const page = await context.newPage();7const worker = await beginWork(context);8const { pageProxy } = await worker.createPageInContext();9console.log(pageProxy);
Jest + Playwright - Test callbacks of event-based DOM library
firefox browser does not start in playwright
Is it possible to get the selector from a locator object in playwright?
How to run a list of test suites in a single file concurrently in jest?
Running Playwright in Azure Function
firefox browser does not start in playwright
This question is quite close to a "need more focus" question. But let's try to give it some focus:
Does Playwright has access to the cPicker object on the page? Does it has access to the window object?
Yes, you can access both cPicker and the window object inside an evaluate call.
Should I trigger the events from the HTML file itself, and in the callbacks, print in the DOM the result, in some dummy-element, and then infer from that dummy element text that the callbacks fired?
Exactly, or you can assign values to a javascript variable:
const cPicker = new ColorPicker({
onClickOutside(e){
},
onInput(color){
window['color'] = color;
},
onChange(color){
window['result'] = color;
}
})
And then
it('Should call all callbacks with correct arguments', async() => {
await page.goto(`http://localhost:5000/tests/visual/basic.html`, {waitUntil:'load'})
// Wait until the next frame
await page.evaluate(() => new Promise(requestAnimationFrame))
// Act
// Assert
const result = await page.evaluate(() => window['color']);
// Check the value
})
Check out the latest blogs from LambdaTest on this topic:
Native apps are developed specifically for one platform. Hence they are fast and deliver superior performance. They can be downloaded from various app stores and are not accessible through browsers.
One of the essential parts when performing automated UI testing, whether using Selenium or another framework, is identifying the correct web elements the tests will interact with. However, if the web elements are not located correctly, you might get NoSuchElementException in Selenium. This would cause a false negative result because we won’t get to the actual functionality check. Instead, our test will fail simply because it failed to interact with the correct element.
Smartphones have changed the way humans interact with technology. Be it travel, fitness, lifestyle, video games, or even services, it’s all just a few touches away (quite literally so). We only need to look at the growing throngs of smartphone or tablet users vs. desktop users to grasp this reality.
As part of one of my consulting efforts, I worked with a mid-sized company that was looking to move toward a more agile manner of developing software. As with any shift in work style, there is some bewilderment and, for some, considerable anxiety. People are being challenged to leave their comfort zones and embrace a continuously changing, dynamic working environment. And, dare I say it, testing may be the most ‘disturbed’ of the software roles in agile development.
LambdaTest’s Playwright tutorial will give you a broader idea about the Playwright automation framework, its unique features, and use cases with examples to exceed your understanding of Playwright testing. This tutorial will give A to Z guidance, from installing the Playwright framework to some best practices and advanced concepts.
Get 100 minutes of automation test minutes FREE!!