diff --git a/src/page/main.js b/src/page/main.js
index 0c38b58f..66ad9d11 100644
--- a/src/page/main.js
+++ b/src/page/main.js
@@ -6,8 +6,7 @@ import "./cm.css";
 
 if (import.meta.env.DEV) { // vite feat that only import in dev mode
     const modules = import.meta.glob("../shared/dev.js", {eager: true});
-    // eslint-disable-next-line no-global-assign
-    browser = modules["../shared/dev.js"].browser;
+    window.browser = modules["../shared/dev.js"].browser;
     console.info("DEV-ENV", import.meta.env, modules, browser);
 }
 
diff --git a/src/popup/App.svelte b/src/popup/App.svelte
index ca30f696..eca6127a 100644
--- a/src/popup/App.svelte
+++ b/src/popup/App.svelte
@@ -6,7 +6,7 @@
     import PopupItem from "./Components/PopupItem.svelte";
     import View from "./Components/View.svelte";
     import UpdateView from "./Components/Views/UpdateView.svelte";
-    import InstallView from "./Components/Views/InstallView.svelte";
+    import DetailView from "./Components/Views/DetailView.svelte";
     import AllItemsView from "./Components/Views/AllItemsView.svelte";
     import iconOpen from "../shared/img/icon-open.svg?raw";
     import iconUpdate from "../shared/img/icon-update.svg?raw";
@@ -31,13 +31,13 @@
     let header;
     let warn;
     let err;
+    let currentTabItem;
     let scriptChecking;
     let scriptInstalled;
     let showInstallPrompt;
-    let showInstall;
-    let installUserscript; // url, content
-    let installViewUserscript; // metadata
-    let installViewUserscriptError;
+    let showDetailView;
+    let detailViewTitle;
+    let detailViewItem;
     let showAll;
     let allItems = [];
     let resizeTimer;
@@ -123,6 +123,12 @@
         });
     }
 
+    function detailItem(item) {
+        detailViewItem = item;
+        detailViewTitle = "Userscript Detail";
+        showDetailView = true;
+    }
+
     function checkForUpdates() {
         disabled = true;
         initError = false;
@@ -403,18 +409,18 @@
         }
         const content = await res.text();
         // caching script data
-        installUserscript = {url: currentTab.url, content};
+        currentTabItem = {url: currentTab.url, content};
         // send native swift a message, parse metadata and check if installed
         const response = await browser.runtime.sendNativeMessage({name: "POPUP_INSTALL_CHECK", content});
         console.info("POPUP_INSTALL_CHECK:", response);
         if (response.error) {
             console.error(`Error checking .user.js url: ${response.error}`);
             // errorNotification = response.error;
-            installViewUserscriptError = response.error;
+            currentTabItem.error = response.error;
         } else {
             scriptInstalled = response.installed;
-            // caching script metadata
-            installViewUserscript = response.metadata;
+            currentTabItem.installed = response.installed;
+            currentTabItem.metadata = response.metadata;
             // the response will contain the string to display
             // ex: {success: "Click to install"}
             showInstallPrompt = response.success;
@@ -422,9 +428,11 @@
         scriptChecking = false;
     }
 
-    async function showInstallView() {
+    async function installItem() {
+        detailViewItem = currentTabItem;
+        detailViewTitle = "Install Userscript";
         // show the install view
-        showInstall = true;
+        showDetailView = true;
     }
 
     async function installConfirm() {
@@ -436,13 +444,13 @@
         // show loading element
         loading = true;
         // go back to main view
-        showInstall = false;
+        showDetailView = false;
         // double check before send install message
-        if (!installUserscript || !installUserscript.content) {
+        if (!currentTabItem) {
             errorNotification = "Install failed: userscript missing";
         }
         const currentTab = await browser.tabs.getCurrent();
-        if (currentTab.url !== installUserscript.url) {
+        if (currentTab.url !== currentTabItem.url) {
             errorNotification = "Install failed: tab changed unexpectedly";
         }
         if (errorNotification) {
@@ -453,7 +461,7 @@
         // send native swift a message, which will start the install process
         const response = await browser.runtime.sendNativeMessage({
             name: "POPUP_INSTALL_SCRIPT",
-            content: installUserscript.content
+            content: currentTabItem.content
         });
         if (response.error) {
             errorNotification = response.error;
@@ -466,6 +474,29 @@
         refreshView();
     }
 
+    async function updateConfirm() {
+        console.log("updateConfirm");
+        // TODO
+        // will be implement after the new async update check is implemented
+    }
+
+    async function trashConfirm() {
+        disabled = true;
+        const message = {name: "POPUP_TRASH", item: detailViewItem};
+        const response = await browser.runtime.sendNativeMessage(message);
+        if (response.error) {
+            errorNotification = response.error;
+        } else {
+            // delete the item in the cache array after success
+            allItems = allItems.filter(obj => obj.filename !== detailViewItem.filename);
+            // refresh main view
+            refreshView();
+        }
+        disabled = false;
+        // exit detail view
+        showDetailView = undefined;
+    }
+
     onMount(async () => {
         await initialize();
         // run resize again for good measure
@@ -520,7 +551,7 @@
             {showInstallPrompt}
         {:else}
             {scriptInstalled ? "Installed" : "Detected"}:
-            <span on:click={showInstallView}>{showInstallPrompt}</span>
+            <span on:click={installItem}>{showInstallPrompt}</span>
         {/if}
     </div>
 {/if}
@@ -562,7 +593,8 @@
                         subframe={item.subframe}
                         type={item.type}
                         request={!!item.request}
-                        on:click={() => toggleItem(item)}
+                        toggleItem={() => toggleItem(item)}
+                        detailItem={() => detailItem(item)}
                     />
                 {/each}
             </div>
@@ -592,18 +624,19 @@
             {updates}
         />
     </View>
-{:else if showInstall}
+{:else if showDetailView}
     <View
-        headerTitle={"Install Userscript"}
+        headerTitle={detailViewTitle}
         loading={disabled}
-        closeClick={() => showInstall = false}
+        closeClick={() => showDetailView = false}
         showLoaderOnDisabled={true}
     >
-        <InstallView
-            userscript={installViewUserscript}
-            installError={installViewUserscriptError}
-            installCancelClick={() => showInstall = false}
+        <DetailView
+            itemdata={detailViewItem}
+            goBackClick={() => showDetailView = false}
             installConfirmClick={installConfirm}
+            updateConfirmClick={updateConfirm}
+            trashConfirmClick={trashConfirm}
         />
     </View>
 {:else if showAll}
@@ -618,7 +651,8 @@
     >
         <AllItemsView
             allItems={allItems}
-            allItemsToggleItem={toggleItem}
+            toggleItem={toggleItem}
+            detailItem={detailItem}
         />
     </View>
 {/if}
diff --git a/src/popup/Components/PopupItem.svelte b/src/popup/Components/PopupItem.svelte
index 2a3e64a3..14a2919e 100644
--- a/src/popup/Components/PopupItem.svelte
+++ b/src/popup/Components/PopupItem.svelte
@@ -1,5 +1,7 @@
 <script>
+    import IconButton from "../../shared/Components/IconButton.svelte";
     import Tag from "../../shared/Components/Tag.svelte";
+    import iconInfo from "../../shared/img/icon-info.svg?raw";
 
     export let background;
     export let enabled = false;
@@ -7,16 +9,26 @@
     export let type;
     export let subframe;
     export let request = false;
+    export let toggleItem;
+    export let detailItem;
 </script>
 
 <div
     class="item {enabled ? "enabled" : "disabled"} {background ?? ""}"
     on:click
 >
-    <span></span>
-    <div class="truncate">{name}</div>
-    {#if subframe}<div class="subframe">SUB</div>{/if}
-    <Tag type={request ? "request" : type}/>
+    <div class="base" on:click={toggleItem}>
+        <Tag type={request ? "request" : type}/>
+        <span></span>
+        <div class="truncate">{name}</div>
+        {#if subframe}<div class="subframe">SUB</div>{/if}
+    </div>
+    <div class="more" on:click={detailItem}>
+        <IconButton
+            icon={iconInfo}
+            title="Show user script details"
+        />
+    </div>
 </div>
 
 <style>
@@ -24,7 +36,6 @@
         align-items: center;
         cursor: pointer;
         display: flex;
-        padding: 0.5rem 1rem;
         position: relative;
         -webkit-user-select: none;
         user-select: none;
@@ -38,10 +49,42 @@
         .item:hover {
             background-color: rgb(255 255 255 / 0.075);
         }
+
+        .item:active {
+            background-color: rgb(255 255 255 / 0.15);
+        }
     }
 
-    .item:active {
-        background-color: rgb(255 255 255 / 0.15);
+    .item .base {
+        align-items: center;
+        cursor: pointer;
+        display: flex;
+        flex-grow: 1;
+        overflow: hidden;
+        padding: .5rem 0 .5rem .75rem;
+        position: relative;
+        -webkit-user-select: none;
+        user-select: none;
+    }
+
+    .item .more {
+        padding: .5rem;
+        font-weight: bold;
+    }
+
+    .more :global(button svg) {
+        opacity: 1;
+        transform: scale(0.75);
+    }
+
+    @media (hover: hover) {
+        .more :global(button svg:not(:hover)) {
+            opacity: 0.25;
+        }
+
+        .more:hover :global(button svg) {
+            opacity: 1;
+        }
     }
 
     span {
diff --git a/src/popup/Components/Views/AllItemsView.svelte b/src/popup/Components/Views/AllItemsView.svelte
index 6906c6d0..ca784fce 100644
--- a/src/popup/Components/Views/AllItemsView.svelte
+++ b/src/popup/Components/Views/AllItemsView.svelte
@@ -2,7 +2,8 @@
     import PopupItem from "../PopupItem.svelte";
 
     export let allItems = [];
-    export let allItemsToggleItem;
+    export let toggleItem;
+    export let detailItem;
 
     let disabled;
     let rowColorsAll;
@@ -27,7 +28,8 @@
                 subframe={item.subframe}
                 type={item.type}
                 request={!!item.request}
-                on:click={() => allItemsToggleItem(item)}
+                toggleItem={() => toggleItem(item)}
+                detailItem={() => detailItem(item)}
             />
         {/each}
     </div>
diff --git a/src/popup/Components/Views/DetailView.svelte b/src/popup/Components/Views/DetailView.svelte
new file mode 100644
index 00000000..292229b4
--- /dev/null
+++ b/src/popup/Components/Views/DetailView.svelte
@@ -0,0 +1,245 @@
+<script>
+    import iconWarn from "../../../shared/img/icon-warn.svg?raw";
+    import iconError from "../../../shared/img/icon-error.svg?raw";
+    import {parse} from "../../../shared/utils";
+    
+    export let itemdata;
+    export let goBackClick;
+    export let installConfirmClick;
+    export let updateConfirmClick;
+    export let trashConfirmClick;
+
+    const showItems = [
+        "version",
+        "match",
+        "include",
+        "require",
+        "grant"
+    ];
+    let errormsg = itemdata.error;
+    let metadata = itemdata.metadata;
+    let checking;
+    let trashing;
+    let updating; // TODO
+
+    $: checking = trashing || updating;
+
+    function cancelClick() {
+        if (trashing) {
+            return trashing = undefined;
+        }
+        goBackClick();
+    }
+
+    function metadataInit() {
+        if (metadata) return;
+        const parsed = parse(itemdata.content);
+        if (!parsed) {
+            errormsg = "Userscript parsing failed";
+            return;
+        }
+        if (!parsed.metadata) {
+            errormsg = "Userscript metadata missing";
+            return;
+        }
+        metadata = parsed.metadata;
+    }
+    
+    if (!errormsg) {
+        if (!metadata) {
+            metadataInit();
+        }
+    }
+</script>
+
+<div class="view--install">
+    {#if errormsg}
+        <div class="show--error">
+            {@html iconError}
+            <div>Userscript Invaild</div>
+            <p>{errormsg}</p>
+        </div>
+    {:else if metadata}
+        <ul>
+            <li class="item--name">{metadata.name}</li>
+            {#if itemdata.filename}
+                <li class="item--filename">{itemdata.filename}</li>
+            {/if}
+            {#if !checking}
+                {#if metadata.description}
+                    <li class="item--description">{metadata.description}</li>
+                {/if}
+                {#each showItems as key}
+                    {#if metadata[key]}
+                        <li class="item--field">
+                            <div>@{key}</div>
+                            {#each metadata[key] as val}
+                                <div class="truncate">{val}</div>
+                            {/each}
+                        </li>
+                    {/if}
+                {/each}
+            {/if}
+        </ul>
+        {#if itemdata.url}
+        <div class="badge">
+            <div class="badge--icon">{@html iconWarn}</div>
+            <div class="badge--text">Be sure you trust the author before installing. Nefarious code can exploit your security and privacy.</div>
+        </div>
+        {/if}
+        {#if trashing}
+        <div class="badge">
+            <div class="badge--icon">{@html iconWarn}</div>
+            <div class="badge--text">Are you sure you want to trash this file?</div>
+        </div>
+        {/if}
+        <div class="buttons">
+            {#if trashing}
+                <button class="trash" on:click={trashConfirmClick}>
+                    Confirm
+                </button>
+            {/if}
+            <button class="cancel" on:click={cancelClick}>
+                Cancel
+            </button>
+            {#if itemdata.url}
+                <button class="install" on:click={installConfirmClick}>
+                    {itemdata.installed ? "Reinstall" : "Install"}
+                </button>
+            {/if}
+            {#if itemdata.filename && !checking}
+                <button class="trash" on:click={() => trashing = true}>
+                    Trash
+                </button>
+            {/if}
+            {#if itemdata.update && !checking}
+                <button class="update" on:click={updateConfirmClick}>
+                    Update
+                </button>
+            {/if}
+        </div>
+    {/if}
+</div>
+
+<style>
+    .view--install {
+        color: var(--text-color-secondary);
+        padding: 0 1rem;
+    }
+
+    :global(body.ios) .view--install,
+    :global(body.ipados) .view--install {
+        padding-bottom: calc(39px + 1rem);
+    }
+
+    .show--error {
+        color: var(--text-color-disabled);
+        font-weight: 600;
+    }
+
+    .show--error :global(svg) {
+        fill: var(--text-color-disabled);
+        height: 4rem;
+        margin: 2rem auto 0.5rem;
+        width: 4rem;
+    }
+
+    .show--error p {
+        color: var(--text-color-primary);
+        font: var(--text-small);
+        font-family: var(--editor-font);
+        letter-spacing: var(--letter-spacing-small);
+        margin-top: 1rem;
+    }
+
+    ul {
+        padding: 1rem 0;
+        text-align: left;
+    }
+
+    .item--filename {
+        font: var(--text-small);
+        color: var(--text-color-disabled);
+    }
+
+    .item--name {
+        color: var(--text-color-primary);
+        font: var(--text-default);
+        font-weight: bold;
+        letter-spacing: var(--letter-spacing-default);
+    }
+
+    .item--description {
+        font: var(--text-small);
+        letter-spacing: var(--letter-spacing-small);
+    }
+
+    .item--field {
+        font: var(--text-small);
+        letter-spacing: var(--letter-spacing-small);
+        margin-top: 1rem;
+    }
+
+    .item--field > div:nth-child(1) {
+        color: var(--text-color-disabled);
+    }
+
+    .item--field > div:nth-child(n + 2) {
+        color: var(--text-color-secondary);
+        font-family: var(--editor-font);
+    }
+
+    .badge {
+        background-color: var(--color-black);
+        border-radius: var(--border-radius);
+        display: flex;
+        font: var(--text-small);
+        margin: 1rem 0;
+        padding: 0.5rem;
+    }
+
+    .badge--icon {
+        align-self: center;
+        flex-shrink: 0;
+        width: 32px;
+    }
+
+    .badge--icon :global(svg) {
+        fill: var(--color-blue);
+    }
+
+    .badge--text {
+        padding: 0 0.5rem;
+        text-align: left;
+    }
+
+    .buttons {
+        display: flex;
+        flex-wrap: wrap;
+        justify-content: space-between;
+        gap: 1rem;
+        padding-bottom: 1rem;
+    }
+
+    button {
+        background-color: #ffffffa6; /* -text-color-secondary */
+        border-radius: var(--border-radius);
+        color: var(--color-bg-primary);
+        font-weight: 600;
+        flex: 1 0 calc(33.333% - 1rem);
+        height: 2rem;
+    }
+
+    button.install {
+        background-color: var(--color-blue);
+    }
+
+    button.update {
+        background-color: var(--color-yellow);
+    }
+
+    button.trash {
+        color: var(--text-color-primary);
+        background-color: var(--color-red);
+    }
+</style>
\ No newline at end of file
diff --git a/src/popup/Components/Views/InstallView.svelte b/src/popup/Components/Views/InstallView.svelte
deleted file mode 100644
index e1dca2cb..00000000
--- a/src/popup/Components/Views/InstallView.svelte
+++ /dev/null
@@ -1,180 +0,0 @@
-<script>
-    import iconWarn from "../../../shared/img/icon-warn.svg?raw";
-    import iconError from "../../../shared/img/icon-error.svg?raw";
-    
-    export let userscript;
-    export let installError;
-    export let installCancelClick;
-    export let installConfirmClick;
-</script>
-
-<div class="view--install">
-    {#if installError}
-        <div class="install__error">
-            {@html iconError}
-            <div>Couldn't install userscript</div>
-            <p>{installError}</p>
-        </div>
-    {:else if userscript}
-        <ul>
-            <li class="userscript--name">{userscript.name}</li>
-            {#if userscript.description}
-                <li class="userscript--description">{userscript.description}</li>
-            {/if}
-            {#if userscript.match}
-                <li class="userscript--field">
-                    <div>@match</div>
-                    {#each userscript.match as match}
-                        <div class="truncate">{match}</div>
-                    {/each}
-                </li>
-            {/if}
-            {#if userscript.include}
-                <li class="userscript--field">
-                    <div>@include</div>
-                    {#each userscript.include as include}
-                        <div class="truncate">{include}</div>
-                    {/each}
-                </li>
-            {/if}
-            {#if userscript.require}
-                <li class="userscript--field">
-                    <div>@require</div>
-                    {#each userscript.require as require}
-                        <div class="truncate">{require}</div>
-                    {/each}
-                </li>
-            {/if}
-            {#if userscript.grant}
-                <li class="userscript--field">
-                    <div>@grant</div>
-                    {#each userscript.grant as grant}
-                        <div>{grant}</div>
-                    {/each}
-                </li>
-            {/if}
-        </ul>
-        <div class="badge">
-            <div class="badge--icon">{@html iconWarn}</div>
-            <div class="badge--text">Be sure you trust the author before installing. Nefarious code can exploit your security and privacy.</div>
-        </div>
-        <div class="buttons">
-            <button class="cancel" on:click={installCancelClick}>
-                Cancel
-            </button>
-            <button class="install" on:click={installConfirmClick}>
-                Install
-            </button>
-        </div>
-    {/if}
-</div>
-
-<style>
-    .view--install {
-        color: var(--text-color-secondary);
-        padding: 0 1rem;
-    }
-
-    :global(body.ios) .view--install,
-    :global(body.ipados) .view--install {
-        padding-bottom: calc(39px + 1rem);
-    }
-
-    .install__error {
-        color: var(--text-color-disabled);
-        font-weight: 600;
-    }
-
-    .install__error :global(svg) {
-        fill: var(--text-color-disabled);
-        height: 4rem;
-        margin: 2rem auto 0.5rem;
-        width: 4rem;
-    }
-
-    .install__error p {
-        color: var(--text-color-primary);
-        font: var(--text-small);
-        font-family: var(--editor-font);
-        letter-spacing: var(--letter-spacing-small);
-        margin-top: 1rem;
-    }
-
-    ul {
-        padding: 1rem 0;
-        text-align: left;
-    }
-
-    .userscript--name {
-        color: var(--text-color-primary);
-        font: var(--text-default);
-        font-weight: bold;
-        letter-spacing: var(--letter-spacing-default);
-    }
-
-    .userscript--description {
-        font: var(--text-small);
-        letter-spacing: var(--letter-spacing-small);
-    }
-
-    .userscript--field {
-        font: var(--text-small);
-        letter-spacing: var(--letter-spacing-small);
-        margin-top: 1rem;
-    }
-
-    .userscript--field > div:nth-child(1) {
-        color: var(--text-color-disabled);
-    }
-
-    .userscript--field > div:nth-child(n + 2) {
-        color: var(--text-color-secondary);
-        font-family: var(--editor-font);
-    }
-
-    .badge {
-        background-color: var(--color-black);
-        border-radius: var(--border-radius);
-        display: flex;
-        font: var(--text-small);
-        margin: 1rem 0;
-        padding: 0.5rem;
-    }
-
-    .badge--icon {
-        align-self: center;
-        flex-shrink: 0;
-        width: 32px;
-    }
-
-    .badge--icon :global(svg) {
-        fill: var(--color-blue);
-    }
-
-    .badge--text {
-        padding: 0 0.5rem;
-        text-align: left;
-    }
-
-    .buttons {
-        display: flex;
-        padding-bottom: 1rem;
-    }
-
-    button {
-        background-color: #ffffffa6; /* -text-color-secondary */
-        border-radius: var(--border-radius);
-        color: var(--color-bg-primary);
-        flex-grow: 1;
-        height: 2rem;
-    }
-
-    button:nth-child(1) {
-        margin-right: 0.5rem;
-    }
-
-    button:nth-child(2) {
-        background-color: var(--color-blue);
-        margin-left: 0.5rem;
-    }
-</style>
diff --git a/src/popup/main.js b/src/popup/main.js
index 23e0ab93..03752163 100644
--- a/src/popup/main.js
+++ b/src/popup/main.js
@@ -5,10 +5,9 @@ import App from "./App.svelte";
 
 if (import.meta.env.DEV) { // vite feat that only import in dev mode
     const modules = import.meta.glob("../shared/dev.js", {eager: true});
-    // eslint-disable-next-line no-global-assign
-    browser = modules["../shared/dev.js"].browser;
+    window.browser = modules["../shared/dev.js"].browser;
     console.info("DEV-ENV", import.meta.env, modules, browser);
-    // macos popup style
+    // macos popup simulation
     const style = document.createElement("style");
     style.textContent = `
 body {
diff --git a/src/shared/dev.js b/src/shared/dev.js
index 5bf75d5d..4a052791 100644
--- a/src/shared/dev.js
+++ b/src/shared/dev.js
@@ -55,6 +55,25 @@ function generateFile(type, updates = false, longName = false, request = false)
     };
 }
 
+function generateMetadata(type, updates = false, longName = false) {
+    const metadata = {
+        description: "This userscript re-implements the \"View Image\" and \"Search by image\" buttons into google images.",
+        grant: ["GM.getValue", "GM.setValue", "GM.xmlHttpRequest"],
+        match: ["https://www.example.com/*", "https://www.example.com/somethingReallylong/goesRightHere"],
+        name: "Test Install Userscript",
+        require: ["https://code.jquery.com/jquery-3.5.1.min.js", "https://code.jquery.com/jquery-1.7.1.min.js"],
+        source: "https://greasyforx.org/scripts/00000-something-something-long-name/code/Something%20something%20long20name.user.js"
+    };
+    if (updates) {
+        metadata.updateURL = ["https://www.k21p.com/example.user.js"];
+        metadata.downloadURL = ["https://www.k21p.com/example.user.js"];
+    }
+    if (longName) {
+        metadata.name = "Test Install Userscript with loooooooooooooooooooooooooooooooooooooooooong name";
+    }
+    return metadata;
+}
+
 const files = [
     generateFile("js", true, true),
     generateFile("css"),
@@ -341,7 +360,7 @@ const _browser = {
                                 filename: "Google Images Restored.js",
                                 disabled: false,
                                 type: "js",
-                                metadata: []
+                                metadata: generateMetadata()
                             },
                             {
                                 name: "Subframe Script Managerial Staffing Company",
@@ -365,14 +384,7 @@ const _browser = {
                     {success: "Click to install", installed: false},
                     {success: "Click to re-install", installed: true}
                 ]);
-                response.metadata = {
-                    description: "This userscript re-implements the \"View Image\" and \"Search by image\" buttons into google images.",
-                    grant: ["GM.getValue", "GM.setValue", "GM.xmlHttpRequest"],
-                    match: ["https://www.example.com/*", "https://www.example.com/somethingReallylong/goesRightHere"],
-                    name: "Test Install Userscript",
-                    require: ["https://code.jquery.com/jquery-3.5.1.min.js", "https://code.jquery.com/jquery-1.7.1.min.js"],
-                    source: "https://greasyforx.org/scripts/00000-something-something-long-name/code/Something%20something%20long20name.user.js"
-                };
+                response.metadata = generateMetadata();
                 // response.error = "something went wrong (dev)";
             }
             if (!responseCallback) {
diff --git a/xcode/Safari-Extension/SafariWebExtensionHandler.swift b/xcode/Safari-Extension/SafariWebExtensionHandler.swift
index 4805adf0..65a95a91 100644
--- a/xcode/Safari-Extension/SafariWebExtensionHandler.swift
+++ b/xcode/Safari-Extension/SafariWebExtensionHandler.swift
@@ -233,18 +233,16 @@ class SafariWebExtensionHandler: NSObject, NSExtensionRequestHandling {
                 }
             #endif
         }
-        else if name == "PAGE_TRASH" {
-            #if os(macOS)
-                if let item = message?["item"] as? [String: Any] {
-                    if trashFile(item) {
-                        response.userInfo = [SFExtensionMessageKey: ["success": true]]
-                    } else {
-                        response.userInfo = [SFExtensionMessageKey: ["error": "failed to trash file"]]
-                    }
+        else if name == "PAGE_TRASH" || name == "POPUP_TRASH"  {
+            if let item = message?["item"] as? [String: Any] {
+                if trashFile(item) {
+                    response.userInfo = [SFExtensionMessageKey: ["success": true]]
                 } else {
-                    inBoundError = true
+                    response.userInfo = [SFExtensionMessageKey: ["error": "failed to trash file"]]
                 }
-            #endif
+            } else {
+                inBoundError = true
+            }
         }
         else if name == "PAGE_UPDATE" {
             #if os(macOS)