From 44f597596406ad167fa8b3d95f7afb3d05ab93e9 Mon Sep 17 00:00:00 2001 From: Andy Sellick Date: Mon, 30 Apr 2018 10:50:47 +0000 Subject: [PATCH 1/3] Remove translation nav component - update to use component from gem --- .../components/_translation-nav.scss | 35 --------- .../components/_translation-nav.html.erb | 16 ----- app/views/components/docs/translation-nav.yml | 61 ---------------- .../content_items/detailed_guide.html.erb | 7 +- app/views/shared/_translations.html.erb | 2 +- config/locales/en.yml | 1 - test/components/translation_nav_test.rb | 72 ------------------- 7 files changed, 2 insertions(+), 192 deletions(-) delete mode 100644 app/assets/stylesheets/components/_translation-nav.scss delete mode 100644 app/views/components/_translation-nav.html.erb delete mode 100644 app/views/components/docs/translation-nav.yml delete mode 100644 test/components/translation_nav_test.rb diff --git a/app/assets/stylesheets/components/_translation-nav.scss b/app/assets/stylesheets/components/_translation-nav.scss deleted file mode 100644 index 5fc207779..000000000 --- a/app/assets/stylesheets/components/_translation-nav.scss +++ /dev/null @@ -1,35 +0,0 @@ -.app-c-translation-nav { - margin-bottom: $gutter; - border-bottom: 1px solid $border-colour; - @include responsive-top-margin; - @include core-16; -} - -.app-c-translation-nav__list { - @extend %contain-floats; - list-style: none; - margin-left: -$gutter-one-third; - margin-right: -$gutter-one-third; -} - -.app-c-translation-nav__list-item { - float: left; - padding-left: $gutter-one-third; - padding-right: $gutter-one-third; - margin-bottom: $gutter-one-third; - border-right: 1px solid $border-colour; - height: 16px; - - .direction-rtl & { - direction: rtl; - float: right; - text-align: start; - border-left: 1px solid $border-colour; - border-right: 0; - } -} - -.app-c-translation-nav__list-item:last-child { - border-right: 0; - border-left: 0; -} diff --git a/app/views/components/_translation-nav.html.erb b/app/views/components/_translation-nav.html.erb deleted file mode 100644 index 8ea7cbb55..000000000 --- a/app/views/components/_translation-nav.html.erb +++ /dev/null @@ -1,16 +0,0 @@ -<% translations ||= [] %> -<% if translations.length > 1 %> - -<% end %> diff --git a/app/views/components/docs/translation-nav.yml b/app/views/components/docs/translation-nav.yml deleted file mode 100644 index 4aa19fc8f..000000000 --- a/app/views/components/docs/translation-nav.yml +++ /dev/null @@ -1,61 +0,0 @@ -name: Translation navigation -description: A list of links to available translations -body: The active property indicates the current language. -accessibility_criteria: | - The component must: - - - be [a landmark with a navigation role](https://accessibility.blog.gov.uk/2016/05/27/using-navigation-landmarks/) - - have an accessible name in the current language, eg "Translations" - - The translation links must: - - - [identify the language of the text](https://www.w3.org/TR/UNDERSTANDING-WCAG20/meaning-other-lang-id.html#meaning-other-lang-id-examples-head) - - [Watch a screen reader pronounce text differently based on lang attribute](https://bit.ly/screenreaderpronunciation) -shared_accessibility_criteria: - - link -examples: - default: - data: - translations: - - locale: 'en' - base_path: '/en' - text: 'English' - active: true - - locale: 'hi' - base_path: '/hi' - text: 'हिंदी' - multiple_translations: - data: - translations: - - locale: 'en' - base_path: '/en' - text: 'English' - active: true - - locale: 'fr' - base_path: '/fr' - text: 'Français' - - locale: 'hi' - base_path: '/hi' - text: 'हिंदी' - - locale: 'ja' - base_path: '/ja' - text: '日本語' - - locale: 'ur' - base_path: '/ur' - text: 'اردو' - - locale: 'zh' - base_path: '/zh' - text: '中文' - right_to_left: - data: - translations: - - locale: 'en' - base_path: '/en' - text: 'English' - - locale: 'ar' - base_path: '/ar' - text: 'العربية' - active: true - context: - right_to_left: true diff --git a/app/views/content_items/detailed_guide.html.erb b/app/views/content_items/detailed_guide.html.erb index 5d3eac61e..909178efa 100644 --- a/app/views/content_items/detailed_guide.html.erb +++ b/app/views/content_items/detailed_guide.html.erb @@ -2,12 +2,7 @@
<%= render 'govuk_component/title', @content_item.title_and_context %>
- <% if @content_item.available_translations.length > 1 %> -
- <%= render 'components/translation-nav', - translations: @content_item.available_translations %> -
- <% end %> + <%= render 'shared/translations' %>
<%= render 'govuk_component/lead_paragraph', text: @content_item.description %>
diff --git a/app/views/shared/_translations.html.erb b/app/views/shared/_translations.html.erb index 84612dba9..f5601dbe8 100644 --- a/app/views/shared/_translations.html.erb +++ b/app/views/shared/_translations.html.erb @@ -1,6 +1,6 @@ <% if @content_item.available_translations.length > 1 %>
- <%= render 'components/translation-nav', + <%= render 'govuk_publishing_components/components/translation-nav', translations: @content_item.available_translations %>
<% end %> diff --git a/config/locales/en.yml b/config/locales/en.yml index f26b58e9a..248484c68 100644 --- a/config/locales/en.yml +++ b/config/locales/en.yml @@ -25,7 +25,6 @@ en: short_ordinal: '%e %B %Y' common: last_updated: "Last updated" - translations: "Translations" components: related_navigation: collections: "Collection" diff --git a/test/components/translation_nav_test.rb b/test/components/translation_nav_test.rb deleted file mode 100644 index 61ec1c21b..000000000 --- a/test/components/translation_nav_test.rb +++ /dev/null @@ -1,72 +0,0 @@ -require 'component_test_helper' - -class TranslationNavTest < ComponentTestCase - def component_name - "translation-nav" - end - - def multiple_translations - [ - { - locale: 'en', - base_path: '/en', - text: 'English', - active: true - }, - { - locale: 'hi', - base_path: '/hi', - text: 'हिंदी', - } - ] - end - - test "renders nothing when no translations are given" do - assert_empty render_component({}) - end - - test "renders nothing when only one translation given" do - assert_empty render_component( - translations: [ - { - locale: 'en', - base_path: '/en', - text: 'English', - active: true - } - ] - ) - end - - test "renders all items in a list" do - render_component(translations: multiple_translations) - assert_select ".app-c-translation-nav__list-item", count: multiple_translations.length - end - - test "renders an active item as text without a link" do - render_component(translations: multiple_translations) - assert_select ".app-c-translation-nav__list-item :not(a)", text: "English" - assert_select "a[href=\"/en\"]", false, "An active item should not be a link" - end - - test "renders inactive items as a link with locale, base path and text" do - render_component(translations: multiple_translations) - assert_select ".app-c-translation-nav__list-item a[lang='hi'][href='/hi']", text: "हिंदी" - end - - test "identifies the language of the text" do - render_component(translations: multiple_translations) - assert_select "span[lang='en']", text: "English" - assert_select "a[lang='hi']", text: "हिंदी" - end - - test "identifies the language of the target page" do - render_component(translations: multiple_translations) - assert_select "a[hreflang='hi']", text: "हिंदी" - end - - test "is labelled as translation navigation" do - render_component(translations: multiple_translations) - assert_select "nav[role='navigation'][aria-label='Translations']" - end -end From e5e0091632d7ab8d780be6a2b435400ae1faaa0d Mon Sep 17 00:00:00 2001 From: Andy Sellick Date: Mon, 30 Apr 2018 10:51:54 +0000 Subject: [PATCH 2/3] Fix tests --- test/integration/case_study_test.rb | 2 +- test/integration/corporate_information_page_test.rb | 2 +- test/integration/detailed_guide_test.rb | 2 +- test/integration/news_article_test.rb | 4 ++-- test/integration/speech_test.rb | 2 +- test/integration/world_location_news_article_test.rb | 4 ++-- 6 files changed, 8 insertions(+), 8 deletions(-) diff --git a/test/integration/case_study_test.rb b/test/integration/case_study_test.rb index b44f37494..98b8d4c09 100644 --- a/test/integration/case_study_test.rb +++ b/test/integration/case_study_test.rb @@ -11,7 +11,7 @@ class CaseStudyTest < ActionDispatch::IntegrationTest assert_has_component_title(@content_item["title"]) assert page.has_text?(@content_item["description"]) - assert page.has_css?('.app-c-translation-nav') + assert page.has_css?('.gem-c-translation-nav') end test "withdrawn case study" do diff --git a/test/integration/corporate_information_page_test.rb b/test/integration/corporate_information_page_test.rb index 63b8108ed..61c8f29f5 100644 --- a/test/integration/corporate_information_page_test.rb +++ b/test/integration/corporate_information_page_test.rb @@ -69,7 +69,7 @@ class CorporateInformationPageTest < ActionDispatch::IntegrationTest test "includes translations" do setup_and_visit_content_item('corporate_information_page_translated_custom_logo') - assert page.has_css?('.app-c-translation-nav') + assert page.has_css?('.gem-c-translation-nav') end test "renders an organisation logo" do diff --git a/test/integration/detailed_guide_test.rb b/test/integration/detailed_guide_test.rb index 7bd21a3fe..28ea24747 100644 --- a/test/integration/detailed_guide_test.rb +++ b/test/integration/detailed_guide_test.rb @@ -69,7 +69,7 @@ class DetailedGuideTest < ActionDispatch::IntegrationTest assert_has_component_title(@content_item["title"]) assert page.has_text?(@content_item["description"]) - assert page.has_css?('.app-c-translation-nav') + assert page.has_css?('.gem-c-translation-nav') end test "renders a contents list" do diff --git a/test/integration/news_article_test.rb b/test/integration/news_article_test.rb index bf1034754..d802ba1ed 100644 --- a/test/integration/news_article_test.rb +++ b/test/integration/news_article_test.rb @@ -28,8 +28,8 @@ class NewsArticleTest < ActionDispatch::IntegrationTest test "renders translation links when there is more than one translation" do setup_and_visit_content_item("news_article") - assert page.has_css?(".app-c-translation-nav") - assert page.has_css?(".app-c-translation-nav__list-item") + assert page.has_css?(".gem-c-translation-nav") + assert page.has_css?(".gem-c-translation-nav__list-item") assert page.has_link?("ردو", href: "/government/news/christmas-2016-prime-ministers-message.ur") end diff --git a/test/integration/speech_test.rb b/test/integration/speech_test.rb index 941a7546c..778cb8c15 100644 --- a/test/integration/speech_test.rb +++ b/test/integration/speech_test.rb @@ -14,7 +14,7 @@ class SpeechTest < ActionDispatch::IntegrationTest assert_has_component_title(@content_item["title"]) assert page.has_text?(@content_item["description"]) - assert page.has_css?('.app-c-translation-nav') + assert page.has_css?('.gem-c-translation-nav') end test "renders metadata and document footer, including speaker" do diff --git a/test/integration/world_location_news_article_test.rb b/test/integration/world_location_news_article_test.rb index 515004b23..3f1b56cf1 100644 --- a/test/integration/world_location_news_article_test.rb +++ b/test/integration/world_location_news_article_test.rb @@ -24,8 +24,8 @@ class WorldLocationNewsArticleTest < ActionDispatch::IntegrationTest test "renders translation links when there is more than one translation" do setup_and_visit_content_item("world_location_news_article_with_multiple_translations") - assert page.has_css?(".app-c-translation-nav") - assert page.has_css?(".app-c-translation-nav__list-item") + assert page.has_css?(".gem-c-translation-nav") + assert page.has_css?(".gem-c-translation-nav__list-item") assert page.has_content?("English हिंदी 日本語 中文 中文") From 63f20081d1e81f064af72621e3a28d47d9da0dde Mon Sep 17 00:00:00 2001 From: Andy Sellick Date: Tue, 1 May 2018 15:24:15 +0000 Subject: [PATCH 3/3] Bump gem --- Gemfile | 2 +- Gemfile.lock | 6 +++--- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/Gemfile b/Gemfile index b25b6d21b..76faf42e4 100644 --- a/Gemfile +++ b/Gemfile @@ -17,7 +17,7 @@ gem 'gds-api-adapters', '~> 52.5' gem 'govuk_ab_testing', '~> 2.4' gem 'govuk_app_config', '~> 1.4' gem 'govuk_frontend_toolkit', '~> 7.4' -gem 'govuk_publishing_components', '~> 7.0.0' +gem 'govuk_publishing_components', '~> 7.1.0' gem 'plek', '~> 2.1' gem 'slimmer', '~> 12.1' diff --git a/Gemfile.lock b/Gemfile.lock index 4591e7445..b50dd423e 100644 --- a/Gemfile.lock +++ b/Gemfile.lock @@ -119,7 +119,7 @@ GEM rubocop-rspec (~> 1.19.0) scss_lint govuk_ab_testing (2.4.1) - govuk_app_config (1.4.2) + govuk_app_config (1.5.0) logstasher (~> 1.2.2) sentry-raven (~> 2.7.1) statsd-ruby (~> 1.4.0) @@ -127,7 +127,7 @@ GEM govuk_frontend_toolkit (7.5.0) railties (>= 3.1.0) sass (>= 3.2.0) - govuk_publishing_components (7.0.0) + govuk_publishing_components (7.1.0) govspeak (>= 5.0.3) govuk_app_config govuk_frontend_toolkit @@ -368,7 +368,7 @@ DEPENDENCIES govuk_ab_testing (~> 2.4) govuk_app_config (~> 1.4) govuk_frontend_toolkit (~> 7.4) - govuk_publishing_components (~> 7.0.0) + govuk_publishing_components (~> 7.1.0) govuk_schemas (~> 3.1) htmlentities (~> 4.3) jasmine-rails