Merge branch '50013-add-browser-platform-flags' into 'master'

Add CSS & JS global flags to represent browser and platform

Closes #50013

See merge request gitlab-org/gitlab-ce!24017

app/helpers/application_helper.rb

@@ -268,6 +268,17 @@ module ApplicationHelper
     _('You are on a read-only GitLab instance.')
   end
 
+  def client_class_list
+    "gl-browser-#{browser.id} gl-platform-#{browser.platform.id}"
+  end
+
+  def client_js_flags
+    {
+      "is#{browser.id.to_s.titlecase}": true,
+      "is#{browser.platform.id.to_s.titlecase}": true
+    }
+  end
+
   def autocomplete_data_sources(object, noteable_type)
     return {} unless object && noteable_type
 

app/views/layouts/_init_client_detection_flags.html.haml

+- client = client_js_flags
+
+- if client
+  -# haml-lint:disable InlineJavaScript
+  :javascript
+    gl = window.gl || {};
+    gl.client = #{client.to_json};

app/views/layouts/application.html.haml

 !!! 5
 %html{ lang: I18n.locale, class: page_class }
   = render "layouts/head"
-  %body{ class: "#{user_application_theme} #{@body_class}", data: { page: body_data_page, project: "#{@project.path if @project}", group: "#{@group.path if @group}", find_file: find_file_path } }
+  %body{ class: "#{user_application_theme} #{@body_class} #{client_class_list}", data: { page: body_data_page, project: "#{@project.path if @project}", group: "#{@group.path if @group}", find_file: find_file_path } }
     = render "layouts/init_auto_complete" if @gfm_form
+    = render "layouts/init_client_detection_flags"
     = render 'peek/bar'
     = render  partial: "layouts/header/default", locals: { project: @project, group: @group }
     = render 'layouts/page', sidebar: sidebar, nav: nav

changelogs/unreleased/50013-add-browser-platform-flags.yml

+---
+title: Add CSS & JS global flags to represent browser and platform
+merge_request: 24017
+author:
+type: other

spec/helpers/application_helper_spec.rb

@@ -168,6 +168,21 @@ describe ApplicationHelper do
     end
   end
 
+  describe '#client_class_list' do
+    it 'returns string containing CSS classes representing client browser and platform' do
+      class_list = helper.client_class_list
+      expect(class_list).to eq('gl-browser-generic gl-platform-other')
+    end
+  end
+
+  describe '#client_js_flags' do
+    it 'returns map containing JS flags representing client browser and platform' do
+      flags_list = helper.client_js_flags
+      expect(flags_list[:isGeneric]).to eq(true)
+      expect(flags_list[:isOther]).to eq(true)
+    end
+  end
+
   describe '#autocomplete_data_sources' do
     let(:project) { create(:project) }
     let(:noteable_type) { Issue }