Fix load anyway button

Fixes the load anyway button on the refactored blob viewer

app/assets/javascripts/blob/components/constants.js

@@ -42,7 +42,7 @@ export const BLOB_RENDER_ERRORS = {
       id: 'load',
       text: __('load it anyway'),
       conjunction: __('or'),
-      href: '#',
+      href: '?expanded=true&viewer=simple',
       target: '',
       event: BLOB_RENDER_EVENT_LOAD,
     },

app/assets/javascripts/repository/components/blob_content_viewer.vue

@@ -45,6 +45,7 @@ export default {
           projectPath: this.projectPath,
           filePath: this.path,
           ref: this.originalBranch || this.ref,
+          shouldFetchRawText: Boolean(this.glFeatures.highlightJs),
         };
       },
       result() {
@@ -203,7 +204,7 @@ export default {
 <template>
   <div>
     <gl-loading-icon v-if="isLoading" size="sm" />
-    <div v-if="blobInfo && !isLoading" class="file-holder gl-overflow-hidden">
+    <div v-if="blobInfo && !isLoading" class="file-holder">
       <blob-header
         :blob="blobInfo"
         :hide-viewer-switcher="!hasRichViewer || isBinaryFileType || isUsingLfs"

app/assets/javascripts/repository/components/table/row.vue

@@ -195,6 +195,7 @@ export default {
         projectPath: this.projectPath,
         filePath: this.path,
         ref: this.ref,
+        shouldFetchRawText: Boolean(this.glFeatures.highlightJs),
       });
     },
     apolloQuery(query, variables) {

app/assets/javascripts/repository/queries/blob_info.query.graphql

 #import "ee_else_ce/repository/queries/path_locks.fragment.graphql"
 
-query getBlobInfo($projectPath: ID!, $filePath: String!, $ref: String!) {
+query getBlobInfo(
+  $projectPath: ID!
+  $filePath: String!
+  $ref: String!
+  $shouldFetchRawText: Boolean!
+) {
   project(fullPath: $projectPath) {
     userPermissions {
       pushCode
@@ -18,7 +23,7 @@ query getBlobInfo($projectPath: ID!, $filePath: String!, $ref: String!) {
           name
           size
           rawSize
-          rawTextBlob
+          rawTextBlob @include(if: $shouldFetchRawText)
           fileType
           language
           path

app/views/projects/blob/_blob.html.haml

 = render "projects/blob/breadcrumb", blob: blob
 - project = @project.present(current_user: current_user)
 - ref = local_assigns[:ref] || @ref
+- expanded = params[:expanded].present?
 
 .info-well.d-none.d-sm-block
   .well-segment
@@ -13,7 +14,7 @@
 #blob-content-holder.blob-content-holder
   - if @code_navigation_path
     #js-code-navigation{ data: { code_navigation_path: @code_navigation_path, blob_path: blob.path, definition_path_prefix: project_blob_path(@project, @ref) } }
-  - if Feature.enabled?(:refactor_blob_viewer, @project, default_enabled: :yaml)
+  - if Feature.enabled?(:refactor_blob_viewer, @project, default_enabled: :yaml) && !expanded
     -# Data info will be removed once we migrate this to use GraphQL
     -# Follow-up issue: https://gitlab.com/gitlab-org/gitlab/-/issues/330406
     #js-view-blob-app{ data: { blob_path: blob.path,

spec/frontend/repository/components/blob_content_viewer_spec.js

@@ -361,6 +361,19 @@ describe('Blob content viewer component', () => {
   });
 
   describe('blob info query', () => {
+    it.each`
+      highlightJs | shouldFetchRawText
+      ${true}     | ${true}
+      ${false}    | ${false}
+    `(
+      'calls blob info query with shouldFetchRawText: $shouldFetchRawText when highlightJs (feature flag): $highlightJs',
+      async ({ highlightJs, shouldFetchRawText }) => {
+        await createComponent({ highlightJs });
+
+        expect(mockResolver).toHaveBeenCalledWith(expect.objectContaining({ shouldFetchRawText }));
+      },
+    );
+
     it('is called with originalBranch value if the prop has a value', async () => {
       await createComponent({ inject: { originalBranch: 'some-branch' } });