Override and mock network responses

Поділитися
Вставка

КОМЕНТАРІ • 79

  • @ChromeDevs
    @ChromeDevs  5 місяців тому

    Subscribe to Chrome for Developers → goo.gle/ChromeDevs

  • @yuhanasyulianto3683
    @yuhanasyulianto3683 8 місяців тому +15

    Finally, very useful features solving day to day real problems

  • @naveensyoutube1839
    @naveensyoutube1839 8 місяців тому +30

    Very helpful feature when the backend apis are unstable 😊

  • @JonatanPetersson
    @JonatanPetersson 8 місяців тому +7

    Exactly what I've wanted for a long time! Amazing news!

  • @Spreadshotstudios
    @Spreadshotstudios 8 місяців тому +4

    This is nice when you dont want to go into Postman or Hoppscotch to create/mock a test/edit api response. I can do it inline 🤠

  • @DuffMan
    @DuffMan 8 місяців тому +3

    Any plans to make graphQL overrides work better? If I recall, because there's only one graphQL endpoint, overrides affects all of them instead of the specific desired operation/request.

  • @ciberman
    @ciberman 8 місяців тому +4

    This is huge! Amazing work! Is it possible to override the status code of the response?

  • @TheHenry0127
    @TheHenry0127 7 місяців тому

    I've been using this technique for a while. Really helpful!

  • @emterroso
    @emterroso 7 місяців тому

    That's awesome! There's one very important feature missing, though: being able to mock the response status code.

  • @davi_singh
    @davi_singh 8 місяців тому

    This is awesome, I often find myself mocking APIs and it was always annoying this would really help me out. On other news, I am the only one who caught they are using a Vue app :D... Super happy to see Vue getting more traction

  • @twocsies
    @twocsies 8 місяців тому +2

    Don't forget to remove the changes when done. It can be tricky to figure out what's going on because there is no special highlighting for local files; they just look like like every other file.

  • @reebow
    @reebow 4 місяці тому

    Awesome video thanks for sharing the tips! Also great that chrome supports mocking apis!

  • @donnifan5685
    @donnifan5685 8 місяців тому +1

    If the url has a cache burster string this override is not working. Can we provide regex somehow like it is available in fiddler

  • @brentmitch4998
    @brentmitch4998 8 місяців тому +1

    If I could give this video two thumbs up I would. Thanks!

  • @claushellsing
    @claushellsing 8 місяців тому +5

    finally I can said goodbye to Fiddler Proxy

  • @theuniscoetzee6840
    @theuniscoetzee6840 8 місяців тому

    brilliant! Love learning from you guys.

  • @pcodes
    @pcodes 6 місяців тому

    Love the video and the animations on her t-shirt.

  • @BraedenSmith
    @BraedenSmith 8 місяців тому

    Can we the response of override non-GET requests? I would guess not because it requires introspection of the payload/other verbs are intended to create side-effects.

  • @greatnile
    @greatnile 8 місяців тому +4

    can I control/overwrite response status code?

    • @GustavoManca-dp7br
      @GustavoManca-dp7br 4 місяці тому +1

      I also wanted to know this. I need to mock responses with 4xx status code. Did you find any solution?

    • @eris94
      @eris94 4 місяці тому

      This needs to be a thing...

  • @chaos_monster
    @chaos_monster 8 місяців тому +2

    can I configure this with something like Playwright or other E2E tools, so I can mock my backend when I just want to test my frontend in a browser?

    • @bepamungkas
      @bepamungkas 8 місяців тому

      Look up APIRequestContext + route.fulfill for playwright, or request interception for puppeteer.

    • @jonghakseo9881
      @jonghakseo9881 8 місяців тому

      use msw(mock service worker)

  • @pipchenko
    @pipchenko 8 місяців тому

    Hi, is it possible to share with other colleagues this override folder in order to have everything being overriden out of the box?

  • @basheeral-momani2032
    @basheeral-momani2032 8 місяців тому

    I need to overrive the query string 😥

  • @kaialexanderbustos224
    @kaialexanderbustos224 8 місяців тому

    Sick features, excited to try em out

  • @nikilk
    @nikilk 2 місяці тому

    @ChromeDevs Can we override the Http Status code from say 200 to 404 using this method ? When I tried it the network tab still shows a 200 status.

    • @ChromeDevs
      @ChromeDevs  2 місяці тому

      Not for now, but you can file a feature request here → goo.gle/devtools-bug.

  • @guocity
    @guocity 4 місяці тому

    how to override same url with different parameters? I want all override

  • @arvinddhakar739
    @arvinddhakar739 8 місяців тому +1

    Very helpful feature, thanks.

  • @kandeepasundaram2501
    @kandeepasundaram2501 8 місяців тому +1

    Is it possible to have some wild card for the url while mocking?

    • @jecjecfish
      @jecjecfish 8 місяців тому

      Currently it's not possible

  • @gleidsonbritosantana8262
    @gleidsonbritosantana8262 8 місяців тому

    I heard a "Tchau!"?
    Great content and features.

  • @zev108
    @zev108 8 місяців тому +1

    wow thats the best one yet!

  • @phamhoa5590
    @phamhoa5590 8 місяців тому

    sometime i can not edit header, and i have to use extension mod header or burp suite

  • @Grenadier8439
    @Grenadier8439 8 місяців тому +3

    what about overriding StatusCode?

    • @GustavoManca-dp7br
      @GustavoManca-dp7br 4 місяці тому

      I also wanted to know this. I need to mock responses with 4xx status code. Did you find any solution?

    • @Grenadier8439
      @Grenadier8439 4 місяці тому

      @@GustavoManca-dp7br Caido->Match & Replace proxy tool

  • @serhiir.5602
    @serhiir.5602 3 місяці тому

    can It be used to override response status code? for example to mimic the error

    • @ChromeDevs
      @ChromeDevs  3 місяці тому

      No, not yet! Fill a feature request goo.gle/devtools-bug?

  • @keffbarn
    @keffbarn 8 місяців тому

    This was actually quite a funny and good video 🍻

  • @ChristopherWarmbold
    @ChristopherWarmbold Місяць тому

    how to override status code to test failed requests

  • @vdavidovich
    @vdavidovich 8 місяців тому +1

    Cool stuff! Thanks!

  • @ix3238
    @ix3238 8 місяців тому +1

    amazing!! Thank you so much

  • @licokr
    @licokr 8 місяців тому

    amazing ❤ I haven't utilize already existing features yet tho

  • @josuedr4528
    @josuedr4528 6 місяців тому

    This is useful but couldn't this cause security issues? Like users modifying responses to access stuff they shouldn't?

  • @hngbv951
    @hngbv951 8 місяців тому

    You made my life easier!

  • @flelfwastaken
    @flelfwastaken 8 місяців тому

    Nice Feature, but feel i feel like it shuld indikate that data has been alternated in some way or it will be used by scammers to trick people

  • @typoerror177
    @typoerror177 8 місяців тому +2

    yay for vuejs

  • @AniltonNeto
    @AniltonNeto 8 місяців тому

    please add jq for test in chrome :P

  • @Hoop0u
    @Hoop0u 8 місяців тому

    How to see pages your not allowed to 101

  • @paevents8064
    @paevents8064 8 місяців тому

    Omg. Its a great feature

  • @sealone777
    @sealone777 8 місяців тому

    Amazing!

  • @genyklemberg
    @genyklemberg 8 місяців тому

    Fire 🔥

  • @danielschwartz516
    @danielschwartz516 8 місяців тому

    never worked for me

    • @jecjecfish
      @jecjecfish 8 місяців тому

      May i know why, can you share example?

    • @danielschwartz516
      @danielschwartz516 8 місяців тому

      yea. several times tried to enable CORS requests (Post).
      from what I rememer from last time (1 month ago) the browser just returned the same response headers event tough I have overriden them (for both preflight and the Post).
      I think haf some issue with the override domain (was not saved for the correct domain).

    • @danielschwartz516
      @danielschwartz516 8 місяців тому

      Also probably was using Vivaldi

  • @RickBeacham
    @RickBeacham 8 місяців тому

    Where did you get that T-Shirt? REACTions. LOL..

  • @denischudinov2379
    @denischudinov2379 8 місяців тому

    🔥🔥🔥

  • @sravant
    @sravant 8 місяців тому

    Is google promoting React? See the t-shirt of the instructor.😜

  • @augusto.rickes
    @augusto.rickes 8 місяців тому

    from BrazilJS 🧙‍♂️

  • @armandoenriquez1104
    @armandoenriquez1104 7 місяців тому

    Jane and Dora Winifred Read.

  • @mizuchin36
    @mizuchin36 8 місяців тому

    これは便利!

  • @jogendrapal9275
    @jogendrapal9275 8 місяців тому

    very helpfull

  • @liquidsnake6879
    @liquidsnake6879 2 місяці тому

    We already had extensions that did this and did this better than Chrome does.. undo MV3

  • @carlonnmarte3347
    @carlonnmarte3347 7 місяців тому

    nice

  • @idofilus7464
    @idofilus7464 8 місяців тому

    gold

  • @armandoenriquez1104
    @armandoenriquez1104 7 місяців тому

    Arthur.

  • @FalconTheFries
    @FalconTheFries Місяць тому

    Finally I can be millionaire!

  • @armandoenriquez1104
    @armandoenriquez1104 7 місяців тому

    Again!

  • @armandoenriquez1104
    @armandoenriquez1104 7 місяців тому

    D.W. Read.

  • @armandoenriquez1104
    @armandoenriquez1104 7 місяців тому

    Pal.

  • @espiat9505
    @espiat9505 8 місяців тому

    1 in chat

  • @35C4N0R
    @35C4N0R 8 місяців тому

    Cool , now i can fake my paypal balance and share a screen or video and refresh page :D or faking any other data like number of followers. 😈

  • @armandoenriquez1104
    @armandoenriquez1104 7 місяців тому

    Again.

  • @armandoenriquez1104
    @armandoenriquez1104 7 місяців тому

    Again.

  • @armandoenriquez1104
    @armandoenriquez1104 7 місяців тому

    Again.