Masahiko Funaki mfunaki

## SelectNenByPos.js
function mablJavaScriptStep(mablInputs, callback, pos = '1') {
  // ドロップダウンを開く
  document.querySelector('[data-testid="nen-toggle"]').click();

  // pos 番目の <li> をクリック
  var li = document.querySelector('[data-testid="nen-option-' + pos + '"]');
  li.click();

  // 選択した値（例: 令和7年）をコールバックで返す
  callback(li.textContent);

## result.html
<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>年月日確認</title>
    <style>
        body {
            font-family: 'Helvetica Neue', Arial, 'Hiragino Kaku Gothic ProN', Meiryo, sans-serif;
            background-color: #f0f4f8;

## index.html
<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>年月日選択</title>
    <style>
        body {
            font-family: 'Helvetica Neue', Arial, 'Hiragino Kaku Gothic ProN', Meiryo, sans-serif;
            background-color: #f0f4f8;

## checkTabOrder.js
function mablJavaScriptStep(mablInputs, callback) {
    // 1. フォーカス可能な要素のセレクター
    const selector = 'a, button, input, textarea, select, details, [tabindex]:not([tabindex="-1"])';
    let elements = Array.from(document.querySelectorAll(selector))
        .filter(el => {
            // 非表示要素・親が非表示の要素は除外
            const style = window.getComputedStyle(el);
            return el.offsetWidth > 0 && el.offsetHeight > 0
                && style.visibility !== 'hidden'
                && style.display !== 'none';

## disordered.html
<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>タブオーダー不整列 - 顧客情報入力フォーム</title>
    <style>
        * {
            box-sizing: border-box;
        }

## ordered.html
<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>タブオーダー整列 - 顧客情報入力フォーム</title>
    <style>
        * {
            box-sizing: border-box;
        }
	function mablJavaScriptStep(mablInputs, callback, pos = '1') {
	// ドロップダウンを開く
	document.querySelector('[data-testid="nen-toggle"]').click();

	// pos 番目の <li> をクリック
	var li = document.querySelector('[data-testid="nen-option-' + pos + '"]');
	li.click();

	// 選択した値（例: 令和7年）をコールバックで返す
	callback(li.textContent);
	<!DOCTYPE html>
	<html lang="ja">
	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>年月日確認</title>
	<style>
	body {
	font-family: 'Helvetica Neue', Arial, 'Hiragino Kaku Gothic ProN', Meiryo, sans-serif;
	background-color: #f0f4f8;
	function mablJavaScriptStep(mablInputs, callback) {
	// 1. フォーカス可能な要素のセレクター
	const selector = 'a, button, input, textarea, select, details, [tabindex]:not([tabindex="-1"])';
	let elements = Array.from(document.querySelectorAll(selector))
	.filter(el => {
	// 非表示要素・親が非表示の要素は除外
	const style = window.getComputedStyle(el);
	return el.offsetWidth > 0 && el.offsetHeight > 0
	&& style.visibility !== 'hidden'
	&& style.display !== 'none';