Fix incorrect selector causing the MR button to not show up in GitLab with Fluid layout (#158)

Author: RicePatrick

.gitpod.yml

@@ -2,14 +2,26 @@ image:
   file: .gitpod.Dockerfile
 
 tasks:
-  - init: |
+  - name: install node version
+    init: |
+      nvm install 20
+      nvm use 20
+      nvm uninstall 16
+      npm install -g pnpm
+      gp sync-done node
+
+  # Without nodeJS 20 installed, the "sharp" package won't bundle properly,
+  # so wait until the node update is finished in the prebuild.
+  - name: build package
+    init: |
+      gp sync-await node
       pnpm install
       pnpm build 
       pnpm build-dev-tools 
       pnpm test
     command: |
       pnpm build
-      
+
 ports:
   - name: sync
     port: 8080

src/button/button-contributions.ts

@@ -157,11 +157,11 @@ export const buttonContributions: ButtonContributionParams[] = [
         exampleUrls: ["https://gitlab.com/svenefftinge/browser-extension-test/-/merge_requests/1"],
         match: /\/merge_requests\//,
         selector:
-            "#content-body > div.merge-request > div.detail-page-header.border-bottom-0.gl-block.gl-pt-5.sm\\:\\!gl-flex.is-merge-request > div.detail-page-header-actions.gl-self-start.is-merge-request.js-issuable-actions.gl-flex.gl-mt-1 > div",
+            "body[data-project-id] div.detail-page-header-actions.is-merge-request > div",
         containerElement: createElement("div", { marginLeft: "8px", marginRight: "-8px" }),
         application: "gitlab",
         insertBefore:
-            "#content-body > div.merge-request > div.detail-page-header.border-bottom-0.gl-block.gl-pt-5.sm\\:\\!gl-flex.is-merge-request > div.detail-page-header-actions.gl-self-start.is-merge-request.js-issuable-actions.gl-flex.gl-mt-1 > div > div",
+            "body[data-project-id] div.detail-page-header-actions.is-merge-request > div > div",
         manipulations: [
             {
                 // make the clone button secondary