src/cobalt/layout_tests/testdata/bidi/line-boxes-should-use-containing-block-direction-for-inline-base-direction.html

<!DOCTYPE html>
<!--
 | The start and end edges of a line box are determined by the inline base
 | direction of the line box. In most cases, this is given by its containing
 | block's direction.
 |   https://www.w3.org/TR/css-text-3/#bidi-linebox
 |   https://www.w3.org/International/questions/qa-html-dir#basedirection
 -->
<html>
<head>
  <meta charset="utf-8">
  <style>
    body {
      margin: 0px;
      font-family: Roboto, Noto Naskh Arabic UI;
      font-size: 20px;
      color: #fff;
    }
    .containing-block {
      background-color: #03a9f4;
      width: 200px;
    }
  </style>
</head>
<body>
  <div dir="rtl" class="containing-block">
    <div dir="ltr">&nbsp;.שלום,&nbsp; Yes, that's written ما اسمك؟</div>
    <div dir="rtl">&nbsp;.שלום,&nbsp; Yes, that's written ما اسمك؟</div>
    <div>&nbsp;.שלום,&nbsp; Yes, that's written ما اسمك؟</div>
  </div>
  <div dir="ltr" class="containing-block">
    <div dir="ltr">&nbsp;.שלום,&nbsp; Yes, that's written ما اسمك؟</div>
    <div dir="rtl">&nbsp;.שלום,&nbsp; Yes, that's written ما اسمك؟</div>
    <div>&nbsp;.שלום,&nbsp; Yes, that's written ما اسمك؟</div>
  </div>
</body>
</html>