From 9848f612a85ebfb1cd07d23980ff2bf6d235160a Mon Sep 17 00:00:00 2001
From: Qi <qishaoxuan777@gmail.com>
Date: Fri, 30 Jun 2023 18:09:53 +0800
Subject: [PATCH] fix: prepend "https" if url without protocol when bookmark
 click to open (#3277)

---
 .../src/bookmark-block/bookmark-block.ts      | 20 +++++++++++++------
 1 file changed, 14 insertions(+), 6 deletions(-)

diff --git a/packages/blocks/src/bookmark-block/bookmark-block.ts b/packages/blocks/src/bookmark-block/bookmark-block.ts
index 4e2781ea9502..57747f47f378 100644
--- a/packages/blocks/src/bookmark-block/bookmark-block.ts
+++ b/packages/blocks/src/bookmark-block/bookmark-block.ts
@@ -253,6 +253,15 @@ export class BookmarkBlockComponent extends BlockElement<BookmarkBlockModel> {
     }, 100);
   }
 
+  private _onCardClick() {
+    let link = this.model.url;
+
+    if (!link.match(/^[a-zA-Z]+:\/\//)) {
+      link = 'https://' + link;
+    }
+    window.open(link, '_blank');
+  }
+
   private _onToolbarSelected: ToolbarActionCallback & MenuActionCallback =
     type => {
       if (type === 'caption') {
@@ -313,8 +322,8 @@ export class BookmarkBlockComponent extends BlockElement<BookmarkBlockModel> {
         >
           <div class="affine-bookmark-title">
             <bookmark-loader
-              size="15px"
-              color="var(--affine-primary-color)"
+              .size=${'15px'}
+              .color=${'var(--affine-primary-color)'}
             ></bookmark-loader>
             <div class="affine-bookmark-title-content">Loading...</div>
           </div>
@@ -324,10 +333,9 @@ export class BookmarkBlockComponent extends BlockElement<BookmarkBlockModel> {
         </div>`
       : nothing;
 
-    const linkCard = html`<a
-      href="${url}"
-      target="_blank"
+    const linkCard = html`<div
       class="affine-bookmark-link"
+      @click=${this._onCardClick}
     >
       <div class="affine-bookmark-content-wrapper">
         <div class="affine-bookmark-title">
@@ -345,7 +353,7 @@ export class BookmarkBlockComponent extends BlockElement<BookmarkBlockModel> {
       <div class="affine-bookmark-banner ${image ? 'shadow' : ''}">
         ${image ? html`<img src="${image}" alt="image" />` : DefaultBanner}
       </div>
-    </a>`;
+    </div>`;
 
     if (!url) {
       return createModal;