diff --git a/test/e2e/application/BUILD.gn b/test/e2e/application/BUILD.gn
index 47ccd86..634713f 100644
--- a/test/e2e/application/BUILD.gn
+++ b/test/e2e/application/BUILD.gn
@@ -8,6 +8,7 @@
   sources = [
     "cookies_test.ts",
     "frame-tree_test.ts",
+    "service-worker-network_test.ts",
     "session-storage_test.ts",
     "websql-database_test.ts",
   ]
diff --git a/test/e2e/application/service-worker-network_test.ts b/test/e2e/application/service-worker-network_test.ts
new file mode 100644
index 0000000..266cd6f
--- /dev/null
+++ b/test/e2e/application/service-worker-network_test.ts
@@ -0,0 +1,38 @@
+// Copyright 2020 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+import {assert} from 'chai';
+
+import {click, getBrowserAndPages, step} from '../../shared/helper.js';
+import {beforeEach, describe, it} from '../../shared/mocha-extensions.js';
+import {doubleClickSourceTreeItem, navigateToApplicationTab} from '../helpers/application-helpers.js';
+import {checkIfTabExistsInDrawer, tabExistsInMainPanel} from '../helpers/cross-tool-helper.js';
+import {closeDrawer} from '../helpers/quick_open-helpers.js';
+
+const NETWORK_TAB_SELECTOR = '#tab-network';
+const SERVICE_WORKER_ROW_SELECTOR = '[aria-label="Service Workers"]';
+const TEST_HTML_FILE = 'service-worker-network';
+const SERVICE_WORKER_NETWORK_SELECTOR = '[aria-label="Network requests"]';
+
+describe('The Application Tab', async () => {
+  beforeEach(async () => {
+    const {target} = getBrowserAndPages();
+    await navigateToApplicationTab(target, TEST_HTML_FILE);
+    await doubleClickSourceTreeItem(SERVICE_WORKER_ROW_SELECTOR);
+  });
+
+  it('Clicking on Network requests for service worker should open Network panel in drawer and closing should move it back',
+     async () => {
+       await step('Click on network requests for service worker should open network panel in drawer', async () => {
+         await click(SERVICE_WORKER_NETWORK_SELECTOR);
+         const networkTabInDrawer = await checkIfTabExistsInDrawer(NETWORK_TAB_SELECTOR);
+         assert.isTrue(networkTabInDrawer);
+       });
+
+       await step('Close drawer and network tab should move back to main panel', async () => {
+         await closeDrawer();
+         await tabExistsInMainPanel(NETWORK_TAB_SELECTOR);
+       });
+     });
+});
diff --git a/test/e2e/cross_tool_integration/workflow_test.ts b/test/e2e/cross_tool_integration/workflow_test.ts
index 0ef6528..ebe33a6 100644
--- a/test/e2e/cross_tool_integration/workflow_test.ts
+++ b/test/e2e/cross_tool_integration/workflow_test.ts
@@ -5,7 +5,7 @@
 import {click, reloadDevTools, waitFor} from '../../shared/helper.js';
 import {describe, it} from '../../shared/mocha-extensions.js';
 import {navigateToConsoleTab, navigateToIssuesPanelViaInfoBar, waitForConsoleMessageAndClickOnLink} from '../helpers/console-helpers.js';
-import {clickOnContextMenuItemFromTab, prepareForCrossToolScenario, tabExistsInDrawer, tabExistsInMainPanel} from '../helpers/cross-tool-helper.js';
+import {clickOnContextMenuItemFromTab, MOVE_TO_DRAWER_SELECTOR, MOVE_TO_MAIN_PANEL_SELECTOR, prepareForCrossToolScenario, tabExistsInDrawer, tabExistsInMainPanel} from '../helpers/cross-tool-helper.js';
 import {clickOnFirstLinkInStylesPanel, navigateToElementsTab} from '../helpers/elements-helpers.js';
 import {LAYERS_TAB_SELECTOR} from '../helpers/layers-helpers.js';
 import {MEMORY_TAB_ID, navigateToMemoryTab} from '../helpers/memory-helpers.js';
@@ -56,9 +56,6 @@
   });
 });
 
-const MOVE_TO_DRAWER_SELECTOR = '[aria-label="Move to bottom"]';
-const MOVE_TO_MAIN_PANEL_SELECTOR = '[aria-label="Move to top"]';
-
 describe('A user can move tabs', async function() {
   this.timeout(10000);
 
diff --git a/test/e2e/helpers/cross-tool-helper.ts b/test/e2e/helpers/cross-tool-helper.ts
index 8353374..f6cdf97 100644
--- a/test/e2e/helpers/cross-tool-helper.ts
+++ b/test/e2e/helpers/cross-tool-helper.ts
@@ -22,8 +22,11 @@
   await click(menuItemSelector);
 }
 
-const MAIN_PANEL_SELECTOR = 'div[class*="main-tabbed-pane"][slot*="insertion-point-main"]';
-const DRAWER_PANEL_SELECTOR = 'div[class*="drawer-tabbed-pane"][slot*="insertion-point-sidebar"]';
+export const MOVE_TO_DRAWER_SELECTOR = '[aria-label="Move to bottom"]';
+export const MOVE_TO_MAIN_PANEL_SELECTOR = '[aria-label="Move to top"]';
+export const MAIN_PANEL_SELECTOR = 'div[class*="main-tabbed-pane"][slot*="insertion-point-main"]';
+export const DRAWER_PANEL_SELECTOR = 'div[class*="drawer-tabbed-pane"][slot*="insertion-point-sidebar"]';
+export const TAB_HEADER_SELECTOR = 'div[class*="tabbed-pane-header"]';
 
 export async function tabExistsInMainPanel(tabId: string) {
   const mainPanel = await waitFor(MAIN_PANEL_SELECTOR);
@@ -34,3 +37,31 @@
   const drawer = await waitFor(DRAWER_PANEL_SELECTOR);
   await waitFor(tabId, drawer);
 }
+
+export const checkIfTabExistsInMainPanel = async (tabId: string) => {
+  const mainPanel = await waitFor(MAIN_PANEL_SELECTOR);
+  const header = await waitFor(TAB_HEADER_SELECTOR, mainPanel);
+  const tab = await header.$(tabId);
+  return !!tab;
+};
+
+export const checkIfTabExistsInDrawer = async (tabId: string) => {
+  const drawer = await waitFor(DRAWER_PANEL_SELECTOR);
+  const header = await waitFor(TAB_HEADER_SELECTOR, drawer);
+  const tab = await header.$(tabId);
+  return !!tab;
+};
+
+export const moveTabToDrawer = async (tabId: string) => {
+  if (!checkIfTabExistsInMainPanel(tabId)) {
+    return;
+  }
+  await clickOnContextMenuItemFromTab(tabId, MOVE_TO_DRAWER_SELECTOR);
+};
+
+export const moveTabToMainPanel = async (tabId: string) => {
+  if (!checkIfTabExistsInDrawer(tabId)) {
+    return;
+  }
+  await clickOnContextMenuItemFromTab(tabId, MOVE_TO_MAIN_PANEL_SELECTOR);
+};
diff --git a/test/e2e/helpers/quick_open-helpers.ts b/test/e2e/helpers/quick_open-helpers.ts
index 84a2fd4..f50105a 100644
--- a/test/e2e/helpers/quick_open-helpers.ts
+++ b/test/e2e/helpers/quick_open-helpers.ts
@@ -2,7 +2,7 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
-import {$$, getBrowserAndPages, platform, typeText, waitFor} from '../../shared/helper.js';
+import {$$, click, getBrowserAndPages, platform, typeText, waitFor} from '../../shared/helper.js';
 
 export const QUICK_OPEN_SELECTOR = '[aria-label="Quick open"]';
 const QUICK_OPEN_ITEMS_SELECTOR = '.filtered-list-widget-item';
@@ -58,6 +58,12 @@
   return snippets;
 }
 
+export const closeDrawer = async () => {
+  const closeButtonSelector = '[aria-label="Close drawer"]';
+  await waitFor(closeButtonSelector);
+  await click(closeButtonSelector);
+};
+
 export const getSelectedItemText = async () => {
   const quickOpenElement = await waitFor(QUICK_OPEN_SELECTOR);
   const selectedRow = await waitFor(QUICK_OPEN_SELECTED_ITEM_SELECTOR, quickOpenElement);
diff --git a/test/e2e/resources/application/BUILD.gn b/test/e2e/resources/application/BUILD.gn
index d6c574e..106e14d 100644
--- a/test/e2e/resources/application/BUILD.gn
+++ b/test/e2e/resources/application/BUILD.gn
@@ -9,6 +9,9 @@
     "cookies.html",
     "dedicated-worker.js",
     "frame-tree.html",
+    "main.css",
+    "service-worker-network.html",
+    "service-worker.js",
     "session-storage.html",
     "websql-database.html",
   ]
diff --git a/test/e2e/resources/application/main.css b/test/e2e/resources/application/main.css
new file mode 100644
index 0000000..aba022a
--- /dev/null
+++ b/test/e2e/resources/application/main.css
@@ -0,0 +1,8 @@
+/**
+ * Copyright 2020 The Chromium Authors. All rights reserved.
+ * Use of this source code is governed by a BSD-style license that can be
+ * found in the LICENSE file.
+ */
+body {
+  height: 100%;
+}
diff --git a/test/e2e/resources/application/service-worker-network.html b/test/e2e/resources/application/service-worker-network.html
new file mode 100644
index 0000000..9fb54a1
--- /dev/null
+++ b/test/e2e/resources/application/service-worker-network.html
@@ -0,0 +1,9 @@
+<!--
+  Copyright 2020 The Chromium Authors. All rights reserved.
+  Use of this source code is governed by a BSD-style license that can be
+  found in the LICENSE file.
+-->
+<link rel="stylesheet" href="main.css" />
+<script>
+  navigator.serviceWorker.register('service-worker.js');
+</script>
diff --git a/test/e2e/resources/application/service-worker.js b/test/e2e/resources/application/service-worker.js
new file mode 100644
index 0000000..1ee35a4
--- /dev/null
+++ b/test/e2e/resources/application/service-worker.js
@@ -0,0 +1,26 @@
+// Copyright 2020 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+// @ts-nocheck
+const CACHE_NAME = 'cache-v1';
+
+const urlsToCache = [
+  '/test/e2e/resources/application/main.css',
+];
+
+
+self.addEventListener('install', (event) => {
+  event.waitUntil(caches.open(CACHE_NAME).then(function(cache) {
+    return cache.addAll(urlsToCache);
+  }));
+});
+
+self.addEventListener('fetch', (event) => {
+  event.respondWith(caches.match(event.request).then(function(response) {
+    if (response) {
+      return response;
+    }
+    return fetch(event.request);
+  }));
+});