Use utility class instead of custom styles

Removes the need for a separate custom style rule for the
serverless url component. Also changes the spec selector
to conform to our styleguide.

app/assets/javascripts/serverless/components/url.vue

@@ -16,7 +16,9 @@ export default {
 
 <template>
   <div class="clipboard-group">
-    <div class="url-text-field label label-monospace monospace">{{ uri }}</div>
+    <div class="gl-cursor-text label label-monospace monospace" data-testid="url-text-field">
+      {{ uri }}
+    </div>
     <clipboard-button
       :text="uri"
       :title="s__('ServerlessURL|Copy URL')"

app/assets/stylesheets/_page_specific_files.scss

@@ -46,7 +46,6 @@
 @import './pages/reports';
 @import './pages/runners';
 @import './pages/search';
-@import './pages/serverless';
 @import './pages/service_desk';
 @import './pages/settings';
 @import './pages/settings_ci_cd';

app/assets/stylesheets/pages/serverless.scss

-.url-text-field {
-  cursor: text;
-}

spec/frontend/serverless/components/url_spec.js

@@ -19,7 +19,7 @@ describe('urlComponent', () => {
     expect(vm.$el.classList.contains('clipboard-group')).toBe(true);
     expect(wrapper.find(ClipboardButton).attributes('text')).toEqual(uri);
 
-    expect(vm.$el.querySelector('.url-text-field').innerHTML).toEqual(uri);
+    expect(vm.$el.querySelector('[data-testid="url-text-field"]').innerHTML).toContain(uri);
 
     vm.$destroy();
   });