Add snapshot tests for arabic script

packages/components/psammead-headings/src/__snapshots__/index.test.jsx.snap

@@ -38,6 +38,44 @@ exports[`Headline component should render correctly 1`] = `
 </h1>
 `;
 
+exports[`Headline component should render correctly with arabic script typography values 1`] = `
+.c0 {
+  font-size: 2rem;
+  line-height: 2.625rem;
+  color: #3F3F42;
+  font-family: ReithSerif,Helvetica,Arial,sans-serif;
+  margin: 0;
+  padding: 2rem 0;
+  font-weight: 500;
+}
+
+@media (min-width:20rem) and (max-width:37.4375rem) {
+  .c0 {
+    font-size: 2.25rem;
+    line-height: 2.875rem;
+  }
+}
+
+@media (min-width:37.5rem) {
+  .c0 {
+    font-size: 2.75rem;
+    line-height: 3.375rem;
+  }
+}
+
+@media (min-width:37.5rem) {
+  .c0 {
+    padding: 2.5rem 0;
+  }
+}
+
+<h1
+  className="c0"
+>
+  This is my headline.
+</h1>
+`;
+
 exports[`SubHeading component attribute id should render without double quotes 1`] = `
 .c0 {
   font-size: 1.25rem;
@@ -197,3 +235,43 @@ exports[`SubHeading component should render correctly 1`] = `
   This is a SubHeading
 </h2>
 `;
+
+exports[`SubHeading component should render correctly with arabic script typography values 1`] = `
+.c0 {
+  font-size: 1.5rem;
+  line-height: 2.125rem;
+  color: #3F3F42;
+  font-family: ReithSans,Helvetica,Arial,sans-serif;
+  margin: 0;
+  padding: 1rem 0;
+  font-weight: 700;
+}
+
+@media (min-width:20rem) and (max-width:37.4375rem) {
+  .c0 {
+    font-size: 1.625rem;
+    line-height: 2.25rem;
+  }
+}
+
+@media (min-width:37.5rem) {
+  .c0 {
+    font-size: 2.375rem;
+    line-height: 3rem;
+  }
+}
+
+@media (min-width:25rem) {
+  .c0 {
+    padding-top: 2rem;
+  }
+}
+
+<h2
+  className="c0"
+  id="-"
+  tabIndex="-1"
+>
+  هذا عنوان فرعي
+</h2>
+`;

packages/components/psammead-headings/src/index.test.jsx

@@ -1,13 +1,18 @@
 import React from 'react';
 import { shouldMatchSnapshot } from '@bbc/psammead-test-helpers';
-import { latin } from '@bbc/gel-foundations/scripts';
+import { latin, arabic } from '@bbc/gel-foundations/scripts';
 import { Headline, SubHeading } from './index';
 
 describe('Headline component', () => {
   shouldMatchSnapshot(
     'should render correctly',
     <Headline script={latin}>This is my headline.</Headline>,
   );
+
+  shouldMatchSnapshot(
+    'should render correctly with arabic script typography values',
+    <Headline script={arabic}>This is my headline.</Headline>,
+  );
 });
 
 describe('SubHeading component', () => {
@@ -38,4 +43,11 @@ describe('SubHeading component', () => {
       This is a SubHeading
     </SubHeading>,
   );
+
+  shouldMatchSnapshot(
+    'should render correctly with arabic script typography values',
+    <SubHeading text="هذا عنوان فرعي" script={arabic}>
+      هذا عنوان فرعي
+    </SubHeading>,
+  );
 });