EmailableReportのHTMLはcssを外部から取得する形になっている。
それではHTML形式のメールとして送れないためjuiceを使用してinline化しAmazonSESで送信する。

準備

以下2ファイル準備する。

  • AWSCLIで送るためのmessageオプションのJSON

    message.json
    {
  "Subject": {
    "Data": "Test email sent using the AWS CLI",
    "Charset": "UTF-8"
  },
  "Body": {
    "Text": {
      "Data": "This is the message body in text format.",
      "Charset": "UTF-8"
    },
    "Html": {
      "Data": "",
      "Charset": "UTF-8"
    }
  }
}

  • レポートのHTML

    report.html
    <html>
<head>
    <title>Myテストレポート - Allure Docker Service</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootswatch/4.3.1/cosmo/bootstrap.css">
    <link rel="shortcut icon" href="/static/favicon">
</head>
<body>
    <div class="container jumbotron">
        <div class="display-4 lead">Myテストレポート</div>
        <div class="lead">Allure Docker Service</div>
        <br>
        <ul class="list-group">
            <li class="list-group-item d-flex justify-content-between align-items-center">
                Project ID
                <span class="badge badge-light badge-pill">
                    default
                </span>
            </li>
            <li class="list-group-item d-flex justify-content-between align-items-center">
                Server Link
                <span class="badge badge-light badge-pill">
                    <a href="https://www.szk302.dev/" target="_blank">https://www.szk302.dev/</a>
                </span>
            </li>
        </ul>
        <br>
        <div class="table-responsive">
            <table class="table table-hover">
                <thead>
                    <tr>
                        <th scope="col" class="table-active text-center">Total</th>
                        <th scope="col" class="table-success text-center">Passed</th>
                        <th scope="col" class="table-danger text-center">Failed</th>
                        <th scope="col" class="table-warning text-center">Broken</th>
                        <th scope="col" class="table-light text-center">Skipped</th>
                        <th scope="col" class="table-dark text-center">Unknown</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <th scope="col" class="text-center">2</th>
                        <th scope="col" class="text-center">1 (50.00%)</th>
                        <th scope="col" class="text-center">1 (50.00%)</th>
                        <th scope="col" class="text-center">0 (0.00%)</th>
                        <th scope="col" class="text-center">0 (0.00%)</th>
                        <th scope="col" class="text-center">0 (0.00%)</th>
                    </tr>
                </tbody>
            </table>
        </div>
        <hr class="my-4">
        <div class="card border-secondary mb-3 border-success">
            <div class="card-header">
                testSomeLibraryMethod()
                <span class="badge badge-pill badge-success">passed</span>
            </div>
            <div class="card-body">
                <!-- CARD TEXT -->
                <p class="card-text">
                    <b>description:</b>
                    <br>
                    <b>duration:</b> 0.042 s
                    <br>
                    <b>severity:</b> normal
                    <br>
                    <b>suite:</b> sample.timeout.SampleTest1
                    <br>
                    <b>testClass:</b> sample.timeout.SampleTest1
                    <br>
                    <b>package:</b> sample.timeout.SampleTest1
                    <br>
                    <br>
                </p>
                <!-- TABLE -->
            </div>
        </div>
        <div class="card border-secondary mb-3 border-danger">
            <div class="card-header">
                testSomeLibraryMethod()
                <span class="badge badge-pill badge-danger">failed</span>
            </div>
            <div class="card-body">
                <!-- CARD TEXT -->
                <p class="card-text">
                    <b>description:</b>
                    <br>
                    <b>duration:</b> 0.052 s
                    <br>
                    <b>severity:</b> normal
                    <br>
                    <b>suite:</b> sample.timeout.SampleTest2
                    <br>
                    <b>testClass:</b> sample.timeout.SampleTest2
                    <br>
                    <b>package:</b> sample.timeout.SampleTest2
                    <br>
                    <br>
                </p>
                <!-- TABLE -->
            </div>
        </div>
    </div>
</body>
</html>

実行

juiceでインライン化しSESで送信(Bash)
docker run -v ${PWD}:/work node:18.11.0-alpine3.16 npx juice /work/report.html /work/inline_report.html
[email protected]
[email protected]
jq '.Body.Html.Data |=$value' --rawfile value ./inline_report.html ./message.json > body.json
aws ses send-email --to "${toMailAddress}" --from "${fromMailAddress}" --message file://body.json

参考