chenx221/yii2-bootstrap5
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

updated rendering of widgets

Browse Source
This commit is contained in:
Simon Karlen 2021-07-12 17:22:29 +02:00
parent 96f471a0bb
commit ee1415b6c3
No known key found for this signature in database
GPG Key ID: 0630C27D666EBCC3
33 changed files with 419 additions and 443 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
src/Accordion.php
View File

@ -150,7 +150,7 @@ class Accordion extends Widget
}
$header = ArrayHelper::remove($item, 'label');
$options = ArrayHelper::getValue($item, 'options', []);
Html::addCssClass($options, ['panel' => 'card']);
Html::addCssClass($options, ['panel' => 'accordion-item']);
$items[] = Html::tag('div', $this->renderItem($header, $item, $index++), $options);
}
@ -192,18 +192,22 @@ class Accordion extends Widget
$itemToggleOptions = array_merge([
'tag' => 'button',
'type' => 'button',
'data-toggle' => 'collapse',
'data-target' => '#' . $options['id'],
'aria-expanded' => $expand ? 'true' : 'false',
'aria-controls' => $options['id'],
'data' => [
'bs-toggle' => 'collapse',
'bs-target' => '#' . $options['id']
],
'aria' => [
'expanded' => $expand ? 'true' : 'false',
'controls' => $options['id']
]
], $this->itemToggleOptions);
$itemToggleTag = ArrayHelper::remove($itemToggleOptions, 'tag', 'button');
if ($itemToggleTag === 'a') {
ArrayHelper::remove($itemToggleOptions, 'data-target');
ArrayHelper::remove($itemToggleOptions, 'data.bs-target');
$headerToggle = Html::a($header, '#' . $id, $itemToggleOptions) . "\n";
} else {
Html::addCssClass($itemToggleOptions, ['feature' => 'btn-link']);
Html::addCssClass($itemToggleOptions, ['widget' => 'accordion-button']);
$headerToggle = Button::widget([
'label' => $header,
'encodeLabel' => false,
@ -214,7 +218,7 @@ class Accordion extends Widget
$header = Html::tag('h5', $headerToggle, ['class' => 'mb-0']);
if (is_string($item['content']) || is_numeric($item['content']) || is_object($item['content'])) {
$content = Html::tag('div', $item['content'], ['class' => 'card-body']) . "\n";
$content = Html::tag('div', $item['content'], ['class' => 'accordion-body']) . "\n";
} elseif (is_array($item['content'])) {
$content = Html::ul($item['content'], [
'class' => 'list-group',
@ -232,14 +236,14 @@ class Accordion extends Widget
$group = [];
if ($this->autoCloseItems) {
$options['data-parent'] = '#' . $this->options['id'];
$options['data']['bs-parent'] = '#' . $this->options['id'];
}
$group[] = Html::tag('div', $header, ['class' => 'card-header', 'id' => $options['id'] . '-heading']);
$group[] = Html::tag('div', $header, ['class' => 'accordion-header', 'id' => $options['id'] . '-heading']);
$group[] = Html::beginTag('div', $options);
$group[] = $content;
if (isset($item['footer'])) {
$group[] = Html::tag('div', $item['footer'], ['class' => 'card-footer']);
$group[] = Html::tag('div', $item['footer'], ['class' => 'accordion-footer']);
}
$group[] = Html::endTag('div');

54
src/ActiveField.php
View File

@ -105,7 +105,7 @@ class ActiveField extends \yii\widgets\ActiveField
/**
* {@inheritdoc}
*/
public $options = ['class' => ['widget' => 'form-group']];
public $options = ['class' => ['widget' => 'mb-3']];
/**
* {@inheritdoc}
*/
@ -120,9 +120,9 @@ class ActiveField extends \yii\widgets\ActiveField
* @since 2.0.7
*/
public array $checkOptions = [
'class' => ['widget' => 'custom-control-input'],
'class' => ['widget' => 'form-check-input'],
'labelOptions' => [
'class' => ['widget' => 'custom-control-label'],
'class' => ['widget' => 'form-check-label'],
],
];
/**
@ -135,9 +135,9 @@ class ActiveField extends \yii\widgets\ActiveField
* @since 2.0.7
*/
public array $radioOptions = [
'class' => ['widget' => 'custom-control-input'],
'class' => ['widget' => 'form-check-input'],
'labelOptions' => [
'class' => ['widget' => 'custom-control-label'],
'class' => ['widget' => 'form-check-label'],
],
];
/**
@ -147,7 +147,7 @@ class ActiveField extends \yii\widgets\ActiveField
/**
* {@inheritdoc}
*/
public $labelOptions = [];
public $labelOptions = ['class' => ['widget' => 'form-label']];
/**
* {@inheritdoc}
*/
@ -164,21 +164,21 @@ class ActiveField extends \yii\widgets\ActiveField
/**
* @var string the template for checkboxes in default layout
*/
public string $checkTemplate = "<div class=\"custom-control custom-checkbox\">\n{input}\n{label}\n{error}\n{hint}\n</div>";
public string $checkTemplate = "<div class=\"form-check\">\n{input}\n{label}\n{error}\n{hint}\n</div>";
/**
* @var string the template for radios in default layout
* @since 2.0.5
*/
public string $radioTemplate = "<div class=\"custom-control custom-radio\">\n{input}\n{label}\n{error}\n{hint}\n</div>";
public string $radioTemplate = "<div class=\"form-check\">\n{input}\n{label}\n{error}\n{hint}\n</div>";
/**
* @var string the template for checkboxes and radios in horizontal layout
*/
public string $checkHorizontalTemplate = "{beginWrapper}\n<div class=\"custom-control custom-checkbox\">\n{input}\n{label}\n{error}\n{hint}\n</div>\n{endWrapper}";
public string $checkHorizontalTemplate = "{beginWrapper}\n<div class=\"form-check\">\n{input}\n{label}\n{error}\n{hint}\n</div>\n{endWrapper}";
/**
* @var string the template for checkboxes and radios in horizontal layout
* @since 2.0.5
*/
public string $radioHorizontalTemplate = "{beginWrapper}\n<div class=\"custom-control custom-radio\">\n{input}\n{label}\n{error}\n{hint}\n</div>\n{endWrapper}";
public string $radioHorizontalTemplate = "{beginWrapper}\n<div class=\"form-check\">\n{input}\n{label}\n{error}\n{hint}\n</div>\n{endWrapper}";
/**
* @var string the `enclosed by label` template for checkboxes and radios in default layout
*/
@ -248,9 +248,9 @@ class ActiveField extends \yii\widgets\ActiveField
{
$checkOptions = $this->checkOptions;
$options = ArrayHelper::merge($checkOptions, $options);
Html::removeCssClass($options, 'form-control');
$labelOptions = ArrayHelper::remove($options, 'labelOptions', []);
$wrapperOptions = ArrayHelper::remove($options, 'wrapperOptions', []);
Html::removeCssClass($options, 'form-control');
$this->labelOptions = ArrayHelper::merge($this->labelOptions, $labelOptions);
$this->wrapperOptions = ArrayHelper::merge($this->wrapperOptions, $wrapperOptions);
@ -266,6 +266,7 @@ class ActiveField extends \yii\widgets\ActiveField
Html::removeCssClass($this->labelOptions, $this->horizontalCssClasses['label']);
Html::addCssClass($this->wrapperOptions, $this->horizontalCssClasses['offset']);
}
Html::removeCssClass($this->labelOptions, 'form-label');
unset($options['template']);
if ($enclosedByLabel) {
@ -284,9 +285,9 @@ class ActiveField extends \yii\widgets\ActiveField
{
$checkOptions = $this->radioOptions;
$options = ArrayHelper::merge($checkOptions, $options);
Html::removeCssClass($options, 'form-control');
$labelOptions = ArrayHelper::remove($options, 'labelOptions', []);
$wrapperOptions = ArrayHelper::remove($options, 'wrapperOptions', []);
Html::removeCssClass($options, 'form-control');
$this->labelOptions = ArrayHelper::merge($this->labelOptions, $labelOptions);
$this->wrapperOptions = ArrayHelper::merge($this->wrapperOptions, $wrapperOptions);
@ -302,6 +303,7 @@ class ActiveField extends \yii\widgets\ActiveField
Html::removeCssClass($this->labelOptions, $this->horizontalCssClasses['label']);
Html::addCssClass($this->wrapperOptions, $this->horizontalCssClasses['offset']);
}
Html::removeCssClass($this->labelOptions, 'form-label');
unset($options['template']);
if ($enclosedByLabel && isset($options['label'])) {
@ -332,10 +334,10 @@ class ActiveField extends \yii\widgets\ActiveField
'label' => $encode ? Html::encode($label) : $label,
'value' => $value,
], $itemOptions);
$wrapperOptions = ArrayHelper::remove($options, 'wrapperOptions', ['class' => ['custom-control', 'custom-checkbox']]);
if ($this->inline) {
Html::addCssClass($wrapperOptions, 'custom-control-inline');
}
$wrapperOptions = ArrayHelper::remove($options, 'wrapperOptions', ['class' => ['form-check']]);
// if ($this->inline) {
// Html::addCssClass($wrapperOptions, 'custom-control-inline');
// }
$html = Html::beginTag('div', $wrapperOptions) . "\n" .
Html::checkbox($name, $checked, $options) . "\n";
@ -373,10 +375,10 @@ class ActiveField extends \yii\widgets\ActiveField
'label' => $encode ? Html::encode($label) : $label,
'value' => $value,
], $itemOptions);
$wrapperOptions = ArrayHelper::remove($options, 'wrapperOptions', ['class' => ['custom-control', 'custom-radio']]);
if ($this->inline) {
Html::addCssClass($wrapperOptions, 'custom-control-inline');
}
$wrapperOptions = ArrayHelper::remove($options, 'wrapperOptions', ['class' => ['form-check']]);
// if ($this->inline) {
// Html::addCssClass($wrapperOptions, 'custom-control-inline');
// }
$html = Html::beginTag('div', $wrapperOptions) . "\n" .
Html::radio($name, $checked, $options) . "\n";
@ -399,7 +401,7 @@ class ActiveField extends \yii\widgets\ActiveField
public function listBox($items, $options = [])
{
if ($this->form->layout === ActiveForm::LAYOUT_INLINE) {
Html::removeCssClass($this->labelOptions, 'sr-only');
Html::removeCssClass($this->labelOptions, 'visually-hidden');
}
return parent::listBox($items, $options);
@ -411,7 +413,7 @@ class ActiveField extends \yii\widgets\ActiveField
public function dropdownList($items, $options = [])
{
if ($this->form->layout === ActiveForm::LAYOUT_INLINE) {
Html::removeCssClass($this->labelOptions, 'sr-only');
Html::removeCssClass($this->labelOptions, 'visually-hidden');
}
return parent::dropdownList($items, $options);
@ -482,7 +484,7 @@ class ActiveField extends \yii\widgets\ActiveField
'class' => 'form-control',
],
'labelOptions' => [
'class' => [],
'class' => ['form-label'],
],
];
@ -499,7 +501,7 @@ class ActiveField extends \yii\widgets\ActiveField
'wrapper' => 'col-sm-10',
'error' => '',
'hint' => '',
'field' => 'form-group row',
'field' => 'mb-3 row',
];
if (isset($instanceConfig['horizontalCssClasses'])) {
$cssClasses = ArrayHelper::merge($cssClasses, $instanceConfig['horizontalCssClasses']);
@ -515,7 +517,7 @@ class ActiveField extends \yii\widgets\ActiveField
$config['inputOptions']['placeholder'] = true;
$config['enableError'] = false;
Html::addCssClass($config['labelOptions'], ['screenreader' => 'sr-only']);
Html::addCssClass($config['labelOptions'], ['screenreader' => 'visually-hidden']);
}
return $config;
@ -526,7 +528,7 @@ class ActiveField extends \yii\widgets\ActiveField
*/
public function fileInput($options = [])
{
Html::addCssClass($options, ['widget' => 'form-control-file']);
Html::addCssClass($options, ['widget' => 'form-control']);
return parent::fileInput($options);
}

11
src/ActiveForm.php
View File

@ -72,6 +72,10 @@ class ActiveForm extends \yii\widgets\ActiveForm
* Inline form layout
*/
const LAYOUT_INLINE = 'inline';
/**
* Floating labels form layout
*/
const LAYOUT_FLOATING = 'floating';
/**
* @var string the default field class name when calling [[field()]] to create a new field.
@ -114,7 +118,7 @@ class ActiveForm extends \yii\widgets\ActiveForm
*/
public function init()
{
if (!in_array($this->layout, [self::LAYOUT_DEFAULT, self::LAYOUT_HORIZONTAL, self::LAYOUT_INLINE])) {
if (!in_array($this->layout, [self::LAYOUT_DEFAULT, self::LAYOUT_HORIZONTAL, self::LAYOUT_INLINE, self::LAYOUT_FLOATING])) {
throw new InvalidConfigException('Invalid layout type: ' . $this->layout);
}
@ -125,9 +129,10 @@ class ActiveForm extends \yii\widgets\ActiveForm
}
/**
* @inheritdoc
* {@inheritDoc}
* @return ActiveField|\yii\widgets\ActiveField
*/
public function field($model, $attribute, $options = []): \yii\widgets\ActiveField
public function field($model, $attribute, $options = []): ActiveField
{
return parent::field($model, $attribute, $options);
}

19
src/Alert.php
View File

@ -46,7 +46,7 @@ class Alert extends Widget
* the [[begin()]] and [[end()]] calls of the Alert widget will also be treated
* as the body content, and will be rendered before this.
*/
public $body;
public string $body;
/**
* @var array|false the options for rendering the close button tag.
* The close button is displayed in the header of the modal window. Clicking
@ -55,7 +55,6 @@ class Alert extends Widget
* The following special options are supported:
*
* - tag: string, the tag name of the button. Defaults to 'button'.
* - label: string, the label of the button. Defaults to '&times;'.
*
* The rest of the options will be rendered as the HTML attributes of the button tag.
* Please refer to the [Alert documentation](https://getbootstrap.com/docs/5.0/components/alerts/)
@ -91,7 +90,7 @@ class Alert extends Widget
* Renders the alert body and the close button (if any).
* @return string the rendering result
*/
protected function renderBodyEnd()
protected function renderBodyEnd(): string
{
return $this->body . "\n" . $this->renderCloseButton() . "\n";
}
@ -104,14 +103,8 @@ class Alert extends Widget
{
if (($closeButton = $this->closeButton) !== false) {
$tag = ArrayHelper::remove($closeButton, 'tag', 'button');
$label = ArrayHelper::remove($closeButton, 'label', Html::tag('span', '&times;', [
'aria-hidden' => 'true',
]));
if ($tag === 'button' && !isset($closeButton['type'])) {
$closeButton['type'] = 'button';
}
return Html::tag($tag, $label, $closeButton);
return Html::tag($tag, '', $closeButton);
} else {
return null;
}
@ -127,8 +120,10 @@ class Alert extends Widget
if ($this->closeButton !== false) {
$this->closeButton = array_merge([
'data-dismiss' => 'alert',
'class' => ['widget' => 'close'],
'type' => 'button',
'class' => ['widget' => 'btn-close'],
'data' => ['bs-dismiss' => 'alert'],
'aria' => ['label' => 'Close']
], $this->closeButton);
Html::addCssClass($this->options, ['toggle' => 'alert-dismissible']);

4
src/BootstrapAsset.php
View File

@ -14,7 +14,5 @@ class BootstrapAsset extends AssetBundle
'css/bootstrap.css',
];
public $js = [
'js/bootstrap.bundle.js',
];
public $js = [];
}

2
src/BootstrapWidgetTrait.php
View File

@ -94,6 +94,4 @@ trait BootstrapWidgetTrait
$this->getView()->registerJs(implode("\n", $js));
}
}
abstract function getView();
}

7
src/Breadcrumbs.php
View File

@ -89,6 +89,9 @@ class Breadcrumbs extends Widget
Html::addCssClass($this->options, ['widget' => 'breadcrumb']);
}
/**
* {@inheritDoc}
*/
public function run(): string
{
if (!isset($this->options['id'])) {
@ -98,8 +101,6 @@ class Breadcrumbs extends Widget
/** @psalm-suppress InvalidArgument */
Html::addCssClass($this->options, ['widget' => 'breadcrumb']);
$this->registerPlugin('breadcrumb');
if (empty($this->links)) {
return '';
}
@ -133,7 +134,7 @@ class Breadcrumbs extends Widget
* @param string $template the template to be used to rendered the link. The token "{link}" will be replaced by the
* link.
*
* @throws JsonException|RuntimeException if `$link` does not have "label" element.
* @throws RuntimeException if `$link` does not have "label" element.
*
* @return string the rendering result
*/

9
src/Button.php
View File

@ -37,6 +37,7 @@ class Button extends Widget
/**
* Initializes the widget.
* If you override this method, make sure you call the parent implementation first.
* @throws \yii\base\InvalidConfigException
*/
public function init()
{
@ -51,8 +52,10 @@ class Button extends Widget
*/
public function run(): string
{
$this->registerPlugin('button');
return Html::tag($this->tagName, $this->encodeLabel ? Html::encode($this->label) : $this->label,
$this->options);
return Html::tag(
$this->tagName,
$this->encodeLabel ? Html::encode($this->label) : $this->label,
$this->options
);
}
}

12
src/ButtonDropdown.php
View File

@ -147,13 +147,12 @@ class ButtonDropdown extends Widget
if ($this->split) {
$buttonOptions = $this->buttonOptions;
$this->buttonOptions['data-toggle'] = 'dropdown';
$this->buttonOptions['aria-haspopup'] = 'true';
$this->buttonOptions['aria-expanded'] = 'false';
$this->buttonOptions['data'] = ['bs-toggle' => 'dropdown'];
$this->buttonOptions['aria'] = ['expanded' => 'false'];
Html::addCssClass($this->buttonOptions, ['toggle' => 'dropdown-toggle dropdown-toggle-split']);
unset($buttonOptions['id']);
$splitButton = Button::widget([
'label' => '<span class="sr-only">Toggle Dropdown</span>',
'label' => '<span class="visually-hidden">Toggle Dropdown</span>',
'encodeLabel' => false,
'options' => $this->buttonOptions,
'view' => $this->getView(),
@ -161,9 +160,8 @@ class ButtonDropdown extends Widget
} else {
$buttonOptions = $this->buttonOptions;
Html::addCssClass($buttonOptions, ['toggle' => 'dropdown-toggle']);
$buttonOptions['data-toggle'] = 'dropdown';
$buttonOptions['aria-haspopup'] = 'true';
$buttonOptions['aria-expanded'] = 'false';
$buttonOptions['data'] = ['bs-toggle' => 'dropdown'];
$buttonOptions['aria'] = ['expanded' => 'false'];
$splitButton = '';
}

44
src/Carousel.php
View File

@ -76,7 +76,8 @@ class Carousel extends Widget
/**
* Initializes the widget.
* {@inheritDoc}
* @throws InvalidConfigException
*/
public function init()
{
@ -91,9 +92,10 @@ class Carousel extends Widget
* {@inheritdoc}
* @throws InvalidConfigException
*/
public function run()
public function run(): string
{
$this->registerPlugin('carousel');
return implode("\n", [
Html::beginTag('div', $this->options),
$this->renderIndicators(),
@ -107,21 +109,28 @@ class Carousel extends Widget
* Renders carousel indicators.
* @return string the rendering result
*/
public function renderIndicators()
public function renderIndicators(): string
{
if ($this->showIndicators === false) {
return '';
}
$indicators = [];
for ($i = 0, $count = count($this->items); $i < $count; $i++) {
$options = ['data-target' => '#' . $this->options['id'], 'data-slide-to' => $i];
$options = [
'data' => [
'bs-target' => '#' . $this->options['id'],
'bs-slide-to' => $i
],
'type' => 'button'
];
if ($i === 0) {
Html::addCssClass($options, ['activate' => 'active']);
$options['aria']['current'] = 'true';
}
$indicators[] = Html::tag('li', '', $options);
$indicators[] = Html::tag('button', '', $options);
}
return Html::tag('ol', implode("\n", $indicators), ['class' => ['carousel-indicators']]);
return Html::tag('div', implode("\n", $indicators), ['class' => ['carousel-indicators']]);
}
/**
@ -129,7 +138,7 @@ class Carousel extends Widget
* @return string the rendering result
* @throws InvalidConfigException
*/
public function renderItems()
public function renderItems(): string
{
$items = [];
for ($i = 0, $count = count($this->items); $i < $count; $i++) {
@ -145,8 +154,9 @@ class Carousel extends Widget
* @param int $index the item index as the first item should be set to `active`
* @return string the rendering result
* @throws InvalidConfigException if the item is invalid
* @throws \Exception
*/
public function renderItem($item, $index)
public function renderItem($item, int $index): string
{
if (is_string($item)) {
$content = $item;
@ -181,15 +191,21 @@ class Carousel extends Widget
public function renderControls()
{
if (isset($this->controls[0], $this->controls[1])) {
return Html::a($this->controls[0], '#' . $this->options['id'], [
return Html::button($this->controls[0], [
'class' => 'carousel-control-prev',
'data-slide' => 'prev',
'role' => 'button',
'data' => [
'bs-target' => '#' . $this->options['id'],
'bs-slide' => 'prev'
],
'type' => 'button',
]) . "\n"
. Html::a($this->controls[1], '#' . $this->options['id'], [
. Html::button($this->controls[1], [
'class' => 'carousel-control-next',
'data-slide' => 'next',
'role' => 'button',
'data' => [
'bs-target' => '#' . $this->options['id'],
'bs-slide' => 'next'
],
'type' => 'button',
]);
} elseif ($this->controls === false) {
return '';

6
src/Dropdown.php
View File

@ -97,7 +97,7 @@ class Dropdown extends Widget
foreach ($items as $item) {
if (is_string($item)) {
$lines[] = ($item === '-')
? Html::tag('div', '', ['class' => 'dropdown-divider'])
? Html::tag('hr', '', ['class' => 'dropdown-divider'])
: $item;
continue;
}
@ -120,6 +120,7 @@ class Dropdown extends Widget
ArrayHelper::setValue($linkOptions, 'aria-disabled', 'true');
Html::addCssClass($linkOptions, ['disable' => 'disabled']);
} elseif ($active) {
ArrayHelper::setValue($linkOptions, 'aria-current', 'true');
Html::addCssClass($linkOptions, ['activate' => 'active']);
}
@ -141,8 +142,7 @@ class Dropdown extends Widget
$lines[] = Html::beginTag('div', array_merge_recursive(['class' => ['dropdown'], 'aria-expanded' => 'false'], $itemOptions));
$lines[] = Html::a($label, $url, array_merge([
'data-toggle' => 'dropdown',
'aria-haspopup' => 'true',
'data-bs-toggle' => 'dropdown',
'aria-expanded' => 'false',
'role' => 'button',
], $linkOptions));

5
src/LinkPager.php
View File

@ -102,12 +102,12 @@ class LinkPager extends Widget
* @var string|bool the label for the "next" page button. Note that this will NOT be HTML-encoded.
* If this property is false, the "next" page button will not be displayed.
*/
public $nextPageLabel = "<span aria-hidden=\"true\">&raquo;</span>\n<span class=\"sr-only\">Next</span>";
public $nextPageLabel = '<span aria-hidden="true">&raquo;</span';
/**
* @var string|bool the text label for the "previous" page button. Note that this will NOT be HTML-encoded.
* If this property is false, the "previous" page button will not be displayed.
*/
public $prevPageLabel = "<span aria-hidden=\"true\">&laquo;</span>\n<span class=\"sr-only\">Previous</span>";
public $prevPageLabel = '<span aria-hidden="true">&laquo;</span>';
/**
* @var string|bool the text label for the "first" page button. Note that this will NOT be HTML-encoded.
* If it's specified as true, page number will be used as label.
@ -285,6 +285,7 @@ class LinkPager extends Widget
$linkOptions['data-page'] = $page;
if ($active) {
$options['aria'] = ['current' => 'true'];
Html::addCssClass($options, $this->activePageCssClass);
}
if ($disabled) {

72
src/Modal.php
View File

@ -51,35 +51,35 @@ class Modal extends Widget
/**
* @var string the tile content in the modal window.
*/
public $title;
public string $title;
/**
* @var array additional title options
* @see \yii\helpers\Html::renderTagAttributes() for details on how attributes are being rendered.
*/
public $titleOptions = [];
public array $titleOptions = [];
/**
* @var array additional header options
* @see \yii\helpers\Html::renderTagAttributes() for details on how attributes are being rendered.
*/
public $headerOptions = [];
public array $headerOptions = [];
/**
* @var array body options
* @see \yii\helpers\Html::renderTagAttributes() for details on how attributes are being rendered.
*/
public $bodyOptions = [];
public array $bodyOptions = [];
/**
* @var string the footer content in the modal window.
* @var string|null the footer content in the modal window.
*/
public $footer;
public ?string $footer;
/**
* @var array additional footer options
* @see \yii\helpers\Html::renderTagAttributes() for details on how attributes are being rendered.
*/
public $footerOptions = [];
public array $footerOptions = [];
/**
* @var string the modal size. Can be [[SIZE_LARGE]] or [[SIZE_SMALL]], or empty for default.
* @var string|null the modal size. Can be [[SIZE_LARGE]] or [[SIZE_SMALL]], or empty for default.
*/
public $size;
public ?string $size;
/**
* @var array|false the options for rendering the close button tag.
* The close button is displayed in the header of the modal window. Clicking
@ -116,24 +116,25 @@ class Modal extends Widget
* When true the modal-dialog-centered class will be added to the modal-dialog
* @since 2.0.9
*/
public $centerVertical = false;
public bool $centerVertical = false;
/**
* @var boolean whether to make the modal body scrollable
*
* When true the modal-dialog-scrollable class will be added to the modal-dialog
* @since 2.0.9
*/
public $scrollable = false;
public bool $scrollable = false;
/**
* @var array modal dialog options
* @see \yii\helpers\Html::renderTagAttributes() for details on how attributes are being rendered.
* @since 2.0.9
*/
public $dialogOptions = [];
public array $dialogOptions = [];
/**
* Initializes the widget.
* {@inheritDoc}
* @throws \yii\base\InvalidConfigException
*/
public function init()
{
@ -167,10 +168,10 @@ class Modal extends Widget
* Renders the header HTML markup of the modal
* @return string the rendering result
*/
protected function renderHeader()
protected function renderHeader(): string
{
$button = $this->renderCloseButton();
if ($this->title !== null) {
if (isset($this->title)) {
Html::addCssClass($this->titleOptions, ['widget' => 'modal-title']);
$header = Html::tag('h5', $this->title, $this->titleOptions);
} else {
@ -190,7 +191,7 @@ class Modal extends Widget
* Renders the opening tag of the modal body.
* @return string the rendering result
*/
protected function renderBodyBegin()
protected function renderBodyBegin(): string
{
Html::addCssClass($this->bodyOptions, ['widget' => 'modal-body']);
return Html::beginTag('div', $this->bodyOptions);
@ -200,7 +201,7 @@ class Modal extends Widget
* Renders the closing tag of the modal body.
* @return string the rendering result
*/
protected function renderBodyEnd()
protected function renderBodyEnd(): string
{
return Html::endTag('div');
}
@ -209,9 +210,9 @@ class Modal extends Widget
* Renders the HTML markup for the footer of the modal
* @return string the rendering result
*/
protected function renderFooter()
protected function renderFooter(): ?string
{
if ($this->footer !== null) {
if (isset($this->footer)) {
Html::addCssClass($this->footerOptions, ['widget' => 'modal-footer']);
return Html::tag('div', "\n" . $this->footer . "\n", $this->footerOptions);
} else {
@ -223,7 +224,7 @@ class Modal extends Widget
* Renders the toggle button.
* @return string the rendering result
*/
protected function renderToggleButton()
protected function renderToggleButton(): ?string
{
if (($toggleButton = $this->toggleButton) !== false) {
$tag = ArrayHelper::remove($toggleButton, 'tag', 'button');
@ -239,15 +240,12 @@ class Modal extends Widget
* Renders the close button.
* @return string the rendering result
*/
protected function renderCloseButton()
protected function renderCloseButton(): ?string
{
if (($closeButton = $this->closeButton) !== false) {
$tag = ArrayHelper::remove($closeButton, 'tag', 'button');
$label = ArrayHelper::remove($closeButton, 'label', Html::tag('span', '&times;', [
'aria-hidden' => 'true',
]));
return Html::tag($tag, $label, $closeButton);
return Html::tag($tag, '', $closeButton);
} else {
return null;
}
@ -260,47 +258,43 @@ class Modal extends Widget
protected function initOptions()
{
$this->options = array_merge([
'class' => 'fade',
'role' => 'dialog',
'tabindex' => -1,
'aria-hidden' => 'true',
], $this->options);
Html::addCssClass($this->options, ['widget' => 'modal']);
Html::addCssClass($this->options, ['widget' => 'modal fade']);
if ($this->clientOptions !== false) {
if (!empty($this->clientOptions)) {
$this->clientOptions = array_merge(['show' => false], $this->clientOptions);
}
$this->titleOptions = array_merge([
'id' => $this->options['id'] . '-label',
], $this->titleOptions);
if (!isset($this->options['aria-label'], $this->options['aria-labelledby']) && $this->title !== null) {
if (!isset($this->options['aria-label'], $this->options['aria-labelledby']) && isset($this->title)) {
$this->options['aria-labelledby'] = $this->titleOptions['id'];
}
if ($this->closeButton !== false) {
$this->closeButton = array_merge([
'data-dismiss' => 'modal',
'class' => 'close',
'data-bs-dismiss' => 'modal',
'class' => 'btn-close',
'type' => 'button',
'aria-label' => 'Close'
], $this->closeButton);
}
if ($this->toggleButton !== false) {
$this->toggleButton = array_merge([
'data-toggle' => 'modal',
'data-bs-toggle' => 'modal',
'type' => 'button',
], $this->toggleButton);
if (!isset($this->toggleButton['data-target']) && !isset($this->toggleButton['href'])) {
$this->toggleButton['data-target'] = '#' . $this->options['id'];
if (!isset($this->toggleButton['data-bs-target']) && !isset($this->toggleButton['href'])) {
$this->toggleButton['data-bs-target'] = '#' . $this->options['id'];
}
}
$this->dialogOptions = array_merge([
'role' => 'document',
], $this->dialogOptions);
Html::addCssClass($this->dialogOptions, ['widget' => 'modal-dialog']);
if ($this->size) {
if (isset($this->size)) {
Html::addCssClass($this->dialogOptions, ['size' => $this->size]);
}
if ($this->centerVertical) {

15
src/Nav.php
View File

@ -103,7 +103,7 @@ class Nav extends Widget
/**
* Initializes the widget.
* {@inheritDoc}
*/
public function init()
{
@ -120,7 +120,7 @@ class Nav extends Widget
/**
* Renders the widget.
* @return string
* @throws InvalidConfigException
* @throws InvalidConfigException|\Throwable
*/
public function run(): string
{
@ -131,7 +131,7 @@ class Nav extends Widget
/**
* Renders widget items.
* @return string
* @throws InvalidConfigException
* @throws InvalidConfigException|\Throwable
*/
public function renderItems(): string
{
@ -175,7 +175,9 @@ class Nav extends Widget
Html::addCssClass($options, ['widget' => 'nav-item']);
Html::addCssClass($linkOptions, ['widget' => 'nav-link']);
} else {
$linkOptions['data-toggle'] = 'dropdown';
$linkOptions['data-bs-toggle'] = 'dropdown';
$linkOptions['role'] = 'button';
$linkOptions['aria-expanded'] = 'false';
Html::addCssClass($options, ['widget' => 'dropdown nav-item']);
Html::addCssClass($linkOptions, ['widget' => 'dropdown-toggle nav-link']);
if (is_array($items)) {
@ -220,7 +222,9 @@ class Nav extends Widget
* Check to see if a child item is active optionally activating the parent.
* @param array $items @see items
* @param bool $active should the parent be active too
* @return array @see items
* @return array
* @see items
* @throws \Exception
*/
protected function isChildActive(array $items, bool &$active): array
{
@ -256,6 +260,7 @@ class Nav extends Widget
* be considered active.
* @param array $item the menu item to be checked
* @return bool whether the menu item is active
* @throws \Exception
*/
protected function isItemActive(array $item): bool
{

53
src/NavBar.php
View File

@ -84,7 +84,7 @@ class NavBar extends Widget
*/
public string $screenReaderToggleText = 'Toggle navigation';
/**
* @var string the toggle button content. Defaults to bootstrap 4 default `<span class="navbar-toggler-icon"></span>`
* @var string the toggle button content. Defaults to bootstrap 5 default `<span class="navbar-toggler-icon"></span>`
*/
public string $togglerContent = '<span class="navbar-toggler-icon"></span>';
/**
@ -109,7 +109,7 @@ class NavBar extends Widget
/**
* Initializes the widget.
* {@inheritDoc}
*/
public function init()
{
@ -176,29 +176,6 @@ class NavBar extends Widget
BootstrapPluginAsset::register($this->getView());
}
/**
* Renders collapsible toggle button.
* @return string the rendering toggle button.
*/
protected function renderToggleButton(): string
{
$options = $this->togglerOptions;
Html::addCssClass($options, ['widget' => 'navbar-toggler']);
return Html::button(
$this->togglerContent,
ArrayHelper::merge($options, [
'type' => 'button',
'data' => [
'toggle' => 'collapse',
'target' => '#' . $this->collapseOptions['id'],
],
'aria-controls' => $this->collapseOptions['id'],
'aria-expanded' => 'false',
'aria-label' => $this->screenReaderToggleText,
])
);
}
/**
* Container options setter for backwards compatibility
* @param array $collapseOptions
@ -208,4 +185,30 @@ class NavBar extends Widget
{
$this->collapseOptions = $collapseOptions;
}
/**
* Renders collapsible toggle button.
* @return string the rendering toggle button.
*/
protected function renderToggleButton(): string
{
$options = $this->togglerOptions;
Html::addCssClass($options, ['widget' => 'navbar-toggler']);
return Html::button(
$this->togglerContent,
ArrayHelper::merge($options, [
'type' => 'button',
'data' => [
'bs-toggle' => 'collapse',
'bs-target' => '#' . $this->collapseOptions['id'],
],
'aria' => [
'controls' => $this->collapseOptions['id'],
'expanded' => 'false',
'label' => $this->screenReaderToggleText,
]
])
);
}
}

23
src/Progress.php
View File

@ -80,17 +80,17 @@ class Progress extends Widget
/**
* @var string the button label. This property will only be considered if [[bars]] is empty
*/
public $label;
public string $label;
/**
* @var int the amount of progress as a percentage. This property will only be considered if [[bars]] is empty
*/
public $percent = 0;
public int $percent = 0;
/**
* @var array the HTML attributes of the bar. This property will only be considered if [[bars]] is empty
* @see \yii\helpers\Html::renderTagAttributes() for details on how attributes are being rendered.
* @since 2.0.6
*/
public $barOptions = [];
public array $barOptions = [];
/**
* @var array a set of bars that are stacked together to form a single progress bar.
* Each bar is an array of the following structure:
@ -106,7 +106,7 @@ class Progress extends Widget
* ]
* ```
*/
public $bars;
public array $bars;
/**
@ -123,7 +123,7 @@ class Progress extends Widget
* {@inheritdoc}
* @throws InvalidConfigException
*/
public function run()
public function run(): string
{
BootstrapAsset::register($this->getView());
return $this->renderProgress();
@ -133,8 +133,9 @@ class Progress extends Widget
* Renders the progress.
* @return string the rendering result.
* @throws InvalidConfigException if the "percent" option is not set in a stacked progress bar.
* @throws \Exception
*/
protected function renderProgress()
protected function renderProgress(): string
{
$out = Html::beginTag('div', $this->options) . "\n";
if (empty($this->bars)) {
@ -164,14 +165,16 @@ class Progress extends Widget
* @param array $options the HTML attributes of the bar
* @return string the rendering result.
*/
protected function renderBar($percent, $label = '', $options = [])
protected function renderBar(int $percent, string $label = '', array $options = []): string
{
$percent = (float)trim(rtrim((string)$percent, '%'));
$options = array_merge($options, [
'role' => 'progressbar',
'aria-valuenow' => $percent,
'aria-valuemin' => 0,
'aria-valuemax' => 100,
'aria' => [
'valuenow' => $percent,
'valuemin' => 0,
'valuemax' => 100,
]
]);
Html::addCssClass($options, ['widget' => 'progress-bar']);
Html::addCssStyle($options, ['width' => $percent . '%'], true);

6
src/Tabs.php
View File

@ -165,6 +165,7 @@ class Tabs extends Widget
* @param array $items
* @param string $prefix
* @throws InvalidConfigException
* @throws \Exception
*/
protected function prepareItems(array &$items, string $prefix = '')
{
@ -196,9 +197,9 @@ class Tabs extends Widget
ArrayHelper::setValue($items[$n], 'url', '#' . $options['id']);
ArrayHelper::setValue($items[$n], 'linkOptions.data.toggle', 'tab');
ArrayHelper::setValue($items[$n], 'linkOptions.role', 'tab');
ArrayHelper::setValue($items[$n], 'linkOptions.aria-controls', $options['id']);
ArrayHelper::setValue($items[$n], 'linkOptions.aria.controls', $options['id']);
if (!$disabled) {
ArrayHelper::setValue($items[$n], 'linkOptions.aria-selected', $selected ? 'true' : 'false');
ArrayHelper::setValue($items[$n], 'linkOptions.aria.selected', $selected ? 'true' : 'false');
}
} else {
continue;
@ -236,6 +237,7 @@ class Tabs extends Widget
*
* This method activates the first tab that is visible and
* not explicitly set to inactive (`'active' => false`).
* @throws \Exception
*/
protected function activateFirstVisibleTab()
{

11
src/Toast.php
View File

@ -134,7 +134,7 @@ class Toast extends Widget
{
$button = $this->renderCloseButton();
$tag = ArrayHelper::remove($this->titleOptions, 'tag', 'strong');
Html::addCssClass($this->titleOptions, ['widget' => 'mr-auto']);
Html::addCssClass($this->titleOptions, ['widget' => 'me-auto']);
$title = Html::tag($tag, $this->title === null ? '' : $this->title, $this->titleOptions);
if ($this->dateTime !== false) {
@ -175,11 +175,8 @@ class Toast extends Widget
protected function renderCloseButton(): string
{
$tag = ArrayHelper::remove($this->closeButton, 'tag', 'button');
$label = ArrayHelper::remove($this->closeButton, 'label', Html::tag('span', '&times;', [
'aria-hidden' => 'true',
]));
return Html::tag($tag, "\n" . $label . "\n", $this->closeButton);
return Html::tag($tag, '', $this->closeButton);
}
/**
@ -192,8 +189,8 @@ class Toast extends Widget
$this->closeButton = array_merge([
'aria' => ['label' => 'Close'],
'data' => ['dismiss' => 'toast'],
'class' => ['widget' => 'ml-2 mb-1 close'],
'data' => ['bs-dismiss' => 'toast'],
'class' => ['widget' => 'btn-close'],
'type' => 'button',
], $this->closeButton);

4
src/ToggleButtonGroup.php
View File

@ -68,8 +68,8 @@ class ToggleButtonGroup extends InputWidget
{
parent::init();
$this->registerPlugin('button');
Html::addCssClass($this->options, ['widget' => 'btn-group-toggle']);
$this->options['data-toggle'] = 'buttons';
Html::addCssClass($this->options, ['widget' => 'btn-group']);
$this->options['role'] = 'group';
}
/**

70
tests/AccordionTest.php
View File

@ -71,41 +71,41 @@ class AccordionTest extends TestCase
$this->assertEqualsWithoutLE(<<<HTML
<div id="w0" class="accordion">
<div class="card"><div id="w0-collapse0-heading" class="card-header"><h5 class="mb-0"><button type="button" id="w1" class="btn-link btn" data-toggle="collapse" data-target="#w0-collapse0" aria-expanded="true" aria-controls="w0-collapse0">Collapsible Group Item #1</button>
<div class="accordion-item"><div id="w0-collapse0-heading" class="accordion-header"><h5 class="mb-0"><button type="button" id="w1" class="accordion-button" data-bs-toggle="collapse" data-bs-target="#w0-collapse0" aria-expanded="true" aria-controls="w0-collapse0">Collapsible Group Item #1</button>
</h5></div>
<div id="w0-collapse0" class="collapse show" aria-labelledby="w0-collapse0-heading" data-parent="#w0">
<div id="w0-collapse0" class="collapse show" aria-labelledby="w0-collapse0-heading" data-bs-parent="#w0">
<ul class="list-group">
<li class="list-group-item">test content1</li>
<li class="list-group-item">test content2</li>
</ul>
</div></div>
<div id="testId" class="testClass card"><div id="w0-collapse1-heading" class="card-header"><h5 class="mb-0"><button type="button" id="w2" class="btn-link btn" data-toggle="collapse" data-target="#w0-collapse1" aria-expanded="false" aria-controls="w0-collapse1">Collapsible Group Item #2</button>
<div id="testId" class="testClass accordion-item"><div id="w0-collapse1-heading" class="accordion-header"><h5 class="mb-0"><button type="button" id="w2" class="accordion-button" data-bs-toggle="collapse" data-bs-target="#w0-collapse1" aria-expanded="false" aria-controls="w0-collapse1">Collapsible Group Item #2</button>
</h5></div>
<div id="w0-collapse1" class="testContentOptions collapse" aria-labelledby="w0-collapse1-heading" data-parent="#w0">
<div class="card-body">Das ist das Haus vom Nikolaus</div>
<div id="w0-collapse1" class="testContentOptions collapse" aria-labelledby="w0-collapse1-heading" data-bs-parent="#w0">
<div class="accordion-body">Das ist das Haus vom Nikolaus</div>
<div class="card-footer">Footer</div>
<div class="accordion-footer">Footer</div>
</div></div>
<div id="testId2" class="testClass2 card"><div id="w0-collapse2-heading" class="card-header"><h5 class="mb-0"><button type="button" id="w3" class="btn-link btn" data-toggle="collapse" data-target="#w0-collapse2" aria-expanded="false" aria-controls="w0-collapse2"><h1>Collapsible Group Item #3</h1></button>
<div id="testId2" class="testClass2 accordion-item"><div id="w0-collapse2-heading" class="accordion-header"><h5 class="mb-0"><button type="button" id="w3" class="accordion-button" data-bs-toggle="collapse" data-bs-target="#w0-collapse2" aria-expanded="false" aria-controls="w0-collapse2"><h1>Collapsible Group Item #3</h1></button>
</h5></div>
<div id="w0-collapse2" class="testContentOptions2 collapse" aria-labelledby="w0-collapse2-heading" data-parent="#w0">
<div id="w0-collapse2" class="testContentOptions2 collapse" aria-labelledby="w0-collapse2-heading" data-bs-parent="#w0">
<ul class="list-group">
<li class="list-group-item"><h2>test content1</h2></li>
<li class="list-group-item"><h2>test content2</h2></li>
</ul>
<div class="card-footer">Footer2</div>
<div class="accordion-footer">Footer2</div>
</div></div>
<div id="testId3" class="testClass3 card"><div id="w0-collapse3-heading" class="card-header"><h5 class="mb-0"><button type="button" id="w4" class="btn-link btn" data-toggle="collapse" data-target="#w0-collapse3" aria-expanded="false" aria-controls="w0-collapse3">&lt;h1&gt;Collapsible Group Item #4&lt;/h1&gt;</button>
<div id="testId3" class="testClass3 accordion-item"><div id="w0-collapse3-heading" class="accordion-header"><h5 class="mb-0"><button type="button" id="w4" class="accordion-button" data-bs-toggle="collapse" data-bs-target="#w0-collapse3" aria-expanded="false" aria-controls="w0-collapse3">&lt;h1&gt;Collapsible Group Item #4&lt;/h1&gt;</button>
</h5></div>
<div id="w0-collapse3" class="testContentOptions3 collapse" aria-labelledby="w0-collapse3-heading" data-parent="#w0">
<div id="w0-collapse3" class="testContentOptions3 collapse" aria-labelledby="w0-collapse3-heading" data-bs-parent="#w0">
<ul class="list-group">
<li class="list-group-item"><h2>test content1</h2></li>
<li class="list-group-item"><h2>test content2</h2></li>
</ul>
<div class="card-footer">Footer3</div>
<div class="accordion-footer">Footer3</div>
</div></div>
</div>
@ -137,28 +137,28 @@ HTML
$this->assertEqualsWithoutLE(<<<HTML
<div id="w0" class="accordion">
<div class="card"><div id="w0-collapse0-heading" class="card-header"><h5 class="mb-0"><button type="button" id="w1" class="btn-link btn" data-toggle="collapse" data-target="#w0-collapse0" aria-expanded="true" aria-controls="w0-collapse0">Item1</button>
<div class="accordion-item"><div id="w0-collapse0-heading" class="accordion-header"><h5 class="mb-0"><button type="button" id="w1" class="accordion-button" data-bs-toggle="collapse" data-bs-target="#w0-collapse0" aria-expanded="true" aria-controls="w0-collapse0">Item1</button>
</h5></div>
<div id="w0-collapse0" class="collapse show" aria-labelledby="w0-collapse0-heading" data-parent="#w0">
<div class="card-body">Content1</div>
<div id="w0-collapse0" class="collapse show" aria-labelledby="w0-collapse0-heading" data-bs-parent="#w0">
<div class="accordion-body">Content1</div>
</div></div>
<div class="card"><div id="w0-collapse1-heading" class="card-header"><h5 class="mb-0"><button type="button" id="w2" class="btn-link btn" data-toggle="collapse" data-target="#w0-collapse1" aria-expanded="false" aria-controls="w0-collapse1">Item2</button>
<div class="accordion-item"><div id="w0-collapse1-heading" class="accordion-header"><h5 class="mb-0"><button type="button" id="w2" class="accordion-button" data-bs-toggle="collapse" data-bs-target="#w0-collapse1" aria-expanded="false" aria-controls="w0-collapse1">Item2</button>
</h5></div>
<div id="w0-collapse1" class="collapse" aria-labelledby="w0-collapse1-heading" data-parent="#w0">
<div class="card-body">Content2</div>
<div id="w0-collapse1" class="collapse" aria-labelledby="w0-collapse1-heading" data-bs-parent="#w0">
<div class="accordion-body">Content2</div>
</div></div>
<div class="card"><div id="w0-collapse2-heading" class="card-header"><h5 class="mb-0"><button type="button" id="w3" class="btn-link btn" data-toggle="collapse" data-target="#w0-collapse2" aria-expanded="false" aria-controls="w0-collapse2">Item3</button>
<div class="accordion-item"><div id="w0-collapse2-heading" class="accordion-header"><h5 class="mb-0"><button type="button" id="w3" class="accordion-button" data-bs-toggle="collapse" data-bs-target="#w0-collapse2" aria-expanded="false" aria-controls="w0-collapse2">Item3</button>
</h5></div>
<div id="w0-collapse2" class="collapse" aria-labelledby="w0-collapse2-heading" data-parent="#w0">
<div class="card-body">Content3</div>
<div id="w0-collapse2" class="collapse" aria-labelledby="w0-collapse2-heading" data-bs-parent="#w0">
<div class="accordion-body">Content3</div>
</div></div>
<div class="card"><div id="w0-collapse3-heading" class="card-header"><h5 class="mb-0"><button type="button" id="w4" class="btn-link btn" data-toggle="collapse" data-target="#w0-collapse3" aria-expanded="false" aria-controls="w0-collapse3">FormField</button>
<div class="accordion-item"><div id="w0-collapse3-heading" class="accordion-header"><h5 class="mb-0"><button type="button" id="w4" class="accordion-button" data-bs-toggle="collapse" data-bs-target="#w0-collapse3" aria-expanded="false" aria-controls="w0-collapse3">FormField</button>
</h5></div>
<div id="w0-collapse3" class="collapse" aria-labelledby="w0-collapse3-heading" data-parent="#w0">
<div class="card-body"><div class="form-group field-dynamicmodel-test">
<div id="w0-collapse3" class="collapse" aria-labelledby="w0-collapse3-heading" data-bs-parent="#w0">
<div class="accordion-body"><div class="form-group field-dynamicmodel-test">
<input type="text" id="dynamicmodel-test" class="form-control" name="DynamicModel[test]">
</div></div>
@ -184,16 +184,16 @@ HTML
$this->assertEqualsWithoutLE(<<<HTML
<div id="w0" class="accordion">
<div class="card"><div id="w0-collapse0-heading" class="card-header"><h5 class="mb-0"><button type="button" id="w1" class="btn-link btn" data-toggle="collapse" data-target="#w0-collapse0" aria-expanded="false" aria-controls="w0-collapse0">Item1</button>
<div class="accordion-item"><div id="w0-collapse0-heading" class="accordion-header"><h5 class="mb-0"><button type="button" id="w1" class="accordion-button" data-bs-toggle="collapse" data-bs-target="#w0-collapse0" aria-expanded="false" aria-controls="w0-collapse0">Item1</button>
</h5></div>
<div id="w0-collapse0" class="collapse" aria-labelledby="w0-collapse0-heading" data-parent="#w0">
<div class="card-body">Content1</div>
<div id="w0-collapse0" class="collapse" aria-labelledby="w0-collapse0-heading" data-bs-parent="#w0">
<div class="accordion-body">Content1</div>
</div></div>
<div class="card"><div id="w0-collapse1-heading" class="card-header"><h5 class="mb-0"><button type="button" id="w2" class="btn-link btn" data-toggle="collapse" data-target="#w0-collapse1" aria-expanded="true" aria-controls="w0-collapse1">Item2</button>
<div class="accordion-item"><div id="w0-collapse1-heading" class="accordion-header"><h5 class="mb-0"><button type="button" id="w2" class="accordion-button" data-bs-toggle="collapse" data-bs-target="#w0-collapse1" aria-expanded="true" aria-controls="w0-collapse1">Item2</button>
</h5></div>
<div id="w0-collapse1" class="collapse show" aria-labelledby="w0-collapse1-heading" data-parent="#w0">
<div class="card-body">Content2</div>
<div id="w0-collapse1" class="collapse show" aria-labelledby="w0-collapse1-heading" data-bs-parent="#w0">
<div class="accordion-body">Content2</div>
</div></div>
</div>
@ -246,10 +246,10 @@ HTML
$this->assertEqualsWithoutLE(<<<HTML
<div id="w0" class="accordion">
<div class="card"><div id="w0-collapse0-heading" class="card-header"><h5 class="mb-0"><button type="button" id="w1" class="btn-link btn" data-toggle="collapse" data-target="#w0-collapse0" aria-expanded="true" aria-controls="w0-collapse0">Collapsible Group Item #1</button>
<div class="accordion-item"><div id="w0-collapse0-heading" class="accordion-header"><h5 class="mb-0"><button type="button" id="w1" class="accordion-button" data-bs-toggle="collapse" data-bs-target="#w0-collapse0" aria-expanded="true" aria-controls="w0-collapse0">Collapsible Group Item #1</button>
</h5></div>
<div id="w0-collapse0" class="collapse show" aria-labelledby="w0-collapse0-heading" data-parent="#w0">
<div class="card-body"><div class="form-group field-singer-firstname">
<div id="w0-collapse0" class="collapse show" aria-labelledby="w0-collapse0-heading" data-bs-parent="#w0">
<div class="accordion-body"><div class="form-group field-singer-firstname">
<input type="text" id="singer-firstname" class="form-control" name="Singer[firstName]">
</div></div>
@ -276,12 +276,12 @@ HTML
$output = Accordion::widget([
'items' => $items
]);
$this->assertContains('data-parent="', $output);
$this->assertContains('data-bs-parent="', $output);
$output = Accordion::widget([
'autoCloseItems' => false,
'items' => $items
]);
$this->assertNotContains('data-parent="', $output);
$this->assertNotContains('data-bs-parent="', $output);
}
/**

18
tests/ActiveFieldDefaultFormCheckTest.php
View File

@ -85,7 +85,7 @@ class ActiveFieldDefaultFormCheckTest extends TestCase
$html = $this->_activeField->checkbox()->render();
$expectedHtml = <<<HTML
<div class="form-group field-dynamicmodel-attributename">
<div class="mb-3 field-dynamicmodel-attributename">
<div class="form-check">
<input type="hidden" name="DynamicModel[attributeName]" value="0"><input type="checkbox" id="dynamicmodel-attributename" class="form-check-input" name="DynamicModel[attributeName]" value="1">
<label class="form-check-label" for="dynamicmodel-attributename">Attribute Name</label>
@ -104,7 +104,7 @@ HTML;
$html = $this->_activeField->radio()->render();
$expectedHtml = <<<HTML
<div class="form-group field-dynamicmodel-attributename">
<div class="mb-3 field-dynamicmodel-attributename">
<div class="form-check">
<input type="hidden" name="DynamicModel[attributeName]" value="0"><input type="radio" id="dynamicmodel-attributename" class="form-check-input" name="DynamicModel[attributeName]" value="1">
<label class="form-check-label" for="dynamicmodel-attributename">Attribute Name</label>
@ -122,8 +122,8 @@ HTML;
$html = $this->_activeField->checkboxList([1 => 'name1', 2 => 'name2'])->render();
$expectedHtml = <<<HTML
<div class="form-group field-dynamicmodel-attributename">
<label>Attribute Name</label>
<div class="mb-3 field-dynamicmodel-attributename">
<label class="form-label">Attribute Name</label>
<input type="hidden" name="DynamicModel[attributeName]" value=""><div id="dynamicmodel-attributename"><div class="form-check">
<input type="checkbox" id="i0" class="form-check-input" name="DynamicModel[attributeName][]" value="1">
<label class="form-check-label" for="i0">name1</label>
@ -147,8 +147,8 @@ HTML;
$html = $this->_activeField->radioList([1 => 'name1', 2 => 'name2'])->render();
$expectedHtml = <<<HTML
<div class="form-group field-dynamicmodel-attributename">
<label>Attribute Name</label>
<div class="mb-3 field-dynamicmodel-attributename">
<label class="form-label">Attribute Name</label>
<input type="hidden" name="DynamicModel[attributeName]" value=""><div id="dynamicmodel-attributename" role="radiogroup"><div class="form-check">
<input type="radio" id="i0" class="form-check-input" name="DynamicModel[attributeName]" value="1">
<label class="form-check-label" for="i0">name1</label>
@ -187,7 +187,7 @@ HTML;
$out = ob_get_clean();
$expected = <<<HTML
<div class="form-group row field-dynamicmodel-attributename">
<div class="mb-3 row field-dynamicmodel-attributename">
<label class="col-sm-2 col-form-label" for="dynamicmodel-attributename">Attribute Name</label>
<div class="col-sm-10">
<input type="text" id="dynamicmodel-attributename" class="form-control" name="DynamicModel[attributeName]">
@ -197,7 +197,7 @@ HTML;
</div>
HTML;
$expected2 = <<<HTML
<div class="form-group row field-dynamicmodel-checkbox">
<div class="mb-3 row field-dynamicmodel-checkbox">
<div class="col-sm-10 offset-sm-2">
<div class="form-check">
<input type="hidden" name="DynamicModel[checkbox]" value="0"><input type="checkbox" id="dynamicmodel-checkbox" class="form-check-input" name="DynamicModel[checkbox]" value="1">
@ -209,7 +209,7 @@ HTML;
</div>
HTML;
$expected3 = <<<HTML
<div class="form-group row field-dynamicmodel-gridradios">
<div class="mb-3 row field-dynamicmodel-gridradios">
<label class="col-sm-2 col-form-label">Grid Radios</label>
<div class="col-sm-10">
<input type="hidden" name="DynamicModel[gridRadios]" value=""><div id="dynamicmodel-gridradios" role="radiogroup"><div class="form-check">

162
tests/ActiveFieldTest.php
View File

@ -51,9 +51,9 @@ class ActiveFieldTest extends TestCase
$html = $this->activeField->fileInput()->render();
$expectedHtml = <<<HTML
<div class="form-group field-dynamicmodel-attributename">
<label for="dynamicmodel-attributename">Attribute Name</label>
<input type="hidden" name="DynamicModel[attributeName]" value=""><input type="file" id="dynamicmodel-attributename" class="form-control-file" name="DynamicModel[attributeName]">
<div class="mb-3 field-dynamicmodel-attributename">
<label class="form-label" for="dynamicmodel-attributename">Attribute Name</label>
<input type="hidden" name="DynamicModel[attributeName]" value=""><input type="file" id="dynamicmodel-attributename" class="form-control" name="DynamicModel[attributeName]">
<div class="invalid-feedback"></div>
</div>
@ -70,16 +70,16 @@ HTML;
$html = $this->activeField->radioList([1 => 'name1', 2 => 'name2'])->render();
$expectedHtml = <<<HTML
<div class="form-group field-dynamicmodel-attributename">
<label>Attribute Name</label>
<input type="hidden" name="DynamicModel[attributeName]" value=""><div id="dynamicmodel-attributename" role="radiogroup"><div class="custom-control custom-radio">
<input type="radio" id="i0" class="custom-control-input" name="DynamicModel[attributeName]" value="1">
<label class="custom-control-label" for="i0">name1</label>
<div class="mb-3 field-dynamicmodel-attributename">
<label class="form-label">Attribute Name</label>
<input type="hidden" name="DynamicModel[attributeName]" value=""><div id="dynamicmodel-attributename" role="radiogroup"><div class="form-check">
<input type="radio" id="i0" class="form-check-input" name="DynamicModel[attributeName]" value="1">
<label class="form-check-label" for="i0">name1</label>
</div>
<div class="custom-control custom-radio">
<input type="radio" id="i1" class="custom-control-input" name="DynamicModel[attributeName]" value="2">
<label class="custom-control-label" for="i1">name2</label>
<div class="form-check">
<input type="radio" id="i1" class="form-check-input" name="DynamicModel[attributeName]" value="2">
<label class="form-check-label" for="i1">name2</label>
<div class="invalid-feedback"></div>
</div>
</div>
@ -96,10 +96,10 @@ HTML;
$html = $this->activeField->radio()->render();
$expectedHtml = <<<HTML
<div class="form-group field-dynamicmodel-attributename">
<div class="custom-control custom-radio">
<input type="hidden" name="DynamicModel[attributeName]" value="0"><input type="radio" id="dynamicmodel-attributename" class="custom-control-input is-invalid" name="DynamicModel[attributeName]" value="1" aria-invalid="true">
<label class="custom-control-label" for="dynamicmodel-attributename">Attribute Name</label>
<div class="mb-3 field-dynamicmodel-attributename">
<div class="form-check">
<input type="hidden" name="DynamicModel[attributeName]" value="0"><input type="radio" id="dynamicmodel-attributename" class="form-check-input is-invalid" name="DynamicModel[attributeName]" value="1" aria-invalid="true">
<label class="form-check-label" for="dynamicmodel-attributename">Attribute Name</label>
<div class="invalid-feedback">Test print error message</div>
</div>
@ -115,16 +115,16 @@ HTML;
$html = $this->activeField->radioList([1 => 'name1', 2 => 'name2'])->render();
$expectedHtml = <<<HTML
<div class="form-group field-dynamicmodel-attributename">
<label>Attribute Name</label>
<input type="hidden" name="DynamicModel[attributeName]" value=""><div id="dynamicmodel-attributename" class="is-invalid" role="radiogroup" aria-invalid="true"><div class="custom-control custom-radio">
<input type="radio" id="i0" class="custom-control-input" name="DynamicModel[attributeName]" value="1">
<label class="custom-control-label" for="i0">name1</label>
<div class="mb-3 field-dynamicmodel-attributename">
<label class="form-label">Attribute Name</label>
<input type="hidden" name="DynamicModel[attributeName]" value=""><div id="dynamicmodel-attributename" class="is-invalid" role="radiogroup" aria-invalid="true"><div class="form-check">
<input type="radio" id="i0" class="form-check-input" name="DynamicModel[attributeName]" value="1">
<label class="form-check-label" for="i0">name1</label>
</div>
<div class="custom-control custom-radio">
<input type="radio" id="i1" class="custom-control-input" name="DynamicModel[attributeName]" value="2">
<label class="custom-control-label" for="i1">name2</label>
<div class="form-check">
<input type="radio" id="i1" class="form-check-input" name="DynamicModel[attributeName]" value="2">
<label class="form-check-label" for="i1">name2</label>
<div class="invalid-feedback">Test print error message</div>
</div>
</div>
@ -140,16 +140,16 @@ HTML;
$html = $this->activeField->checkboxList([1 => 'name1', 2 => 'name2'])->render();
$expectedHtml = <<<HTML
<div class="form-group field-dynamicmodel-attributename">
<label>Attribute Name</label>
<input type="hidden" name="DynamicModel[attributeName]" value=""><div id="dynamicmodel-attributename"><div class="custom-control custom-checkbox">
<input type="checkbox" id="i0" class="custom-control-input" name="DynamicModel[attributeName][]" value="1">
<label class="custom-control-label" for="i0">name1</label>
<div class="mb-3 field-dynamicmodel-attributename">
<label class="form-label">Attribute Name</label>
<input type="hidden" name="DynamicModel[attributeName]" value=""><div id="dynamicmodel-attributename"><div class="form-check">
<input type="checkbox" id="i0" class="form-check-input" name="DynamicModel[attributeName][]" value="1">
<label class="form-check-label" for="i0">name1</label>
</div>
<div class="custom-control custom-checkbox">
<input type="checkbox" id="i1" class="custom-control-input" name="DynamicModel[attributeName][]" value="2">
<label class="custom-control-label" for="i1">name2</label>
<div class="form-check">
<input type="checkbox" id="i1" class="form-check-input" name="DynamicModel[attributeName][]" value="2">
<label class="form-check-label" for="i1">name2</label>
<div class="invalid-feedback"></div>
</div>
</div>
@ -166,10 +166,10 @@ HTML;
$html = $this->activeField->checkbox()->render();
$expectedHtml = <<<HTML
<div class="form-group field-dynamicmodel-attributename">
<div class="custom-control custom-checkbox">
<input type="hidden" name="DynamicModel[attributeName]" value="0"><input type="checkbox" id="dynamicmodel-attributename" class="custom-control-input is-invalid" name="DynamicModel[attributeName]" value="1" aria-invalid="true">
<label class="custom-control-label" for="dynamicmodel-attributename">Attribute Name</label>
<div class="mb-3 field-dynamicmodel-attributename">
<div class="form-check">
<input type="hidden" name="DynamicModel[attributeName]" value="0"><input type="checkbox" id="dynamicmodel-attributename" class="form-check-input is-invalid" name="DynamicModel[attributeName]" value="1" aria-invalid="true">
<label class="form-check-label" for="dynamicmodel-attributename">Attribute Name</label>
<div class="invalid-feedback">Test print error message</div>
</div>
@ -185,16 +185,16 @@ HTML;
$html = $this->activeField->checkboxList([1 => 'name1', 2 => 'name2'])->render();
$expectedHtml = <<<HTML
<div class="form-group field-dynamicmodel-attributename">
<label>Attribute Name</label>
<input type="hidden" name="DynamicModel[attributeName]" value=""><div id="dynamicmodel-attributename" class="is-invalid" aria-invalid="true"><div class="custom-control custom-checkbox">
<input type="checkbox" id="i0" class="custom-control-input" name="DynamicModel[attributeName][]" value="1">
<label class="custom-control-label" for="i0">name1</label>
<div class="mb-3 field-dynamicmodel-attributename">
<label class="form-label">Attribute Name</label>
<input type="hidden" name="DynamicModel[attributeName]" value=""><div id="dynamicmodel-attributename" class="is-invalid" aria-invalid="true"><div class="form-check">
<input type="checkbox" id="i0" class="form-check-input" name="DynamicModel[attributeName][]" value="1">
<label class="form-check-label" for="i0">name1</label>
</div>
<div class="custom-control custom-checkbox">
<input type="checkbox" id="i1" class="custom-control-input" name="DynamicModel[attributeName][]" value="2">
<label class="custom-control-label" for="i1">name2</label>
<div class="form-check">
<input type="checkbox" id="i1" class="form-check-input" name="DynamicModel[attributeName][]" value="2">
<label class="form-check-label" for="i1">name2</label>
<div class="invalid-feedback">Test print error message</div>
</div>
</div>
@ -211,16 +211,16 @@ HTML;
$html = $this->activeField->radioList([1 => 'name1', 2 => 'name2'])->render();
$expectedHtml = <<<HTML
<div class="form-group field-dynamicmodel-attributename">
<label>Attribute Name</label>
<input type="hidden" name="DynamicModel[attributeName]" value=""><div id="dynamicmodel-attributename" role="radiogroup"><div class="custom-control custom-radio custom-control-inline">
<input type="radio" id="i0" class="custom-control-input" name="DynamicModel[attributeName]" value="1">
<label class="custom-control-label" for="i0">name1</label>
<div class="mb-3 field-dynamicmodel-attributename">
<label class="form-label">Attribute Name</label>
<input type="hidden" name="DynamicModel[attributeName]" value=""><div id="dynamicmodel-attributename" role="radiogroup"><div class="form-check">
<input type="radio" id="i0" class="form-check-input" name="DynamicModel[attributeName]" value="1">
<label class="form-check-label" for="i0">name1</label>
</div>
<div class="custom-control custom-radio custom-control-inline">
<input type="radio" id="i1" class="custom-control-input" name="DynamicModel[attributeName]" value="2">
<label class="custom-control-label" for="i1">name2</label>
<div class="form-check">
<input type="radio" id="i1" class="form-check-input" name="DynamicModel[attributeName]" value="2">
<label class="form-check-label" for="i1">name2</label>
<div class="invalid-feedback"></div>
</div>
</div>
@ -237,16 +237,16 @@ HTML;
$html = $this->activeField->checkboxList([1 => 'name1', 2 => 'name2'])->render();
$expectedHtml = <<<HTML
<div class="form-group field-dynamicmodel-attributename">
<label>Attribute Name</label>
<input type="hidden" name="DynamicModel[attributeName]" value=""><div id="dynamicmodel-attributename"><div class="custom-control custom-checkbox custom-control-inline">
<input type="checkbox" id="i0" class="custom-control-input" name="DynamicModel[attributeName][]" value="1">
<label class="custom-control-label" for="i0">name1</label>
<div class="mb-3 field-dynamicmodel-attributename">
<label class="form-label">Attribute Name</label>
<input type="hidden" name="DynamicModel[attributeName]" value=""><div id="dynamicmodel-attributename"><div class="form-check">
<input type="checkbox" id="i0" class="form-check-input" name="DynamicModel[attributeName][]" value="1">
<label class="form-check-label" for="i0">name1</label>
</div>
<div class="custom-control custom-checkbox custom-control-inline">
<input type="checkbox" id="i1" class="custom-control-input" name="DynamicModel[attributeName][]" value="2">
<label class="custom-control-label" for="i1">name2</label>
<div class="form-check">
<input type="checkbox" id="i1" class="form-check-input" name="DynamicModel[attributeName][]" value="2">
<label class="form-check-label" for="i1">name2</label>
<div class="invalid-feedback"></div>
</div>
</div>
@ -289,48 +289,4 @@ HTML;
$this->assertContains('data-attribute="test"', $content);
}
/**
*
*/
public function testCustomRadio()
{
Html::$counter = 0;
$this->activeField->inline = true;
$html = $this->activeField->radio()->render();
$expectedHtml = <<<HTML
<div class="form-group field-dynamicmodel-attributename">
<div class="custom-control custom-radio">
<input type="hidden" name="DynamicModel[attributeName]" value="0"><input type="radio" id="dynamicmodel-attributename" class="custom-control-input" name="DynamicModel[attributeName]" value="1">
<label class="custom-control-label" for="dynamicmodel-attributename">Attribute Name</label>
<div class="invalid-feedback"></div>
</div>
</div>
HTML;
$this->assertEqualsWithoutLE($expectedHtml, $html);
}
/**
*
*/
public function testCustomCheckbox()
{
Html::$counter = 0;
$this->activeField->inline = true;
$html = $this->activeField->checkbox()->render();
$expectedHtml = <<<HTML
<div class="form-group field-dynamicmodel-attributename">
<div class="custom-control custom-checkbox">
<input type="hidden" name="DynamicModel[attributeName]" value="0"><input type="checkbox" id="dynamicmodel-attributename" class="custom-control-input" name="DynamicModel[attributeName]" value="1">
<label class="custom-control-label" for="dynamicmodel-attributename">Attribute Name</label>
<div class="invalid-feedback"></div>
</div>
</div>
HTML;
$this->assertEqualsWithoutLE($expectedHtml, $html);
}
}

78
tests/ActiveFormTest.php
View File

@ -38,8 +38,8 @@ class ActiveFormTest extends TestCase
$out = ob_get_clean();
$expected = <<<HTML
<div class="form-group field-dynamicmodel-attributename">
<label for="dynamicmodel-attributename">Attribute Name</label>
<div class="mb-3 field-dynamicmodel-attributename">
<label class="form-label" for="dynamicmodel-attributename">Attribute Name</label>
<input type="text" id="dynamicmodel-attributename" class="form-control" name="DynamicModel[attributeName]">
<div class="invalid-feedback"></div>
@ -71,7 +71,7 @@ HTML;
$out = ob_get_clean();
$expected = <<<HTML
<div class="form-group row field-dynamicmodel-attributename">
<div class="mb-3 row field-dynamicmodel-attributename">
<label class="col-sm-2 col-form-label" for="dynamicmodel-attributename">Attribute Name</label>
<div class="col-sm-10">
<input type="text" id="dynamicmodel-attributename" class="form-control" name="DynamicModel[attributeName]">
@ -81,11 +81,11 @@ HTML;
</div>
HTML;
$expected2 = <<<HTML
<div class="form-group row field-dynamicmodel-checkbox">
<div class="mb-3 row field-dynamicmodel-checkbox">
<div class="col-sm-10 offset-sm-2">
<div class="custom-control custom-checkbox">
<input type="hidden" name="DynamicModel[checkbox]" value="0"><input type="checkbox" id="dynamicmodel-checkbox" class="custom-control-input" name="DynamicModel[checkbox]" value="1">
<label class="custom-control-label" for="dynamicmodel-checkbox">Checkbox</label>
<div class="form-check">
<input type="hidden" name="DynamicModel[checkbox]" value="0"><input type="checkbox" id="dynamicmodel-checkbox" class="form-check-input" name="DynamicModel[checkbox]" value="1">
<label class="form-check-label" for="dynamicmodel-checkbox">Checkbox</label>
<div class="invalid-feedback "></div>
</div>
@ -93,22 +93,22 @@ HTML;
</div>
HTML;
$expected3 = <<<HTML
<div class="form-group row field-dynamicmodel-gridradios">
<div class="mb-3 row field-dynamicmodel-gridradios">
<label class="col-sm-2 col-form-label">Grid Radios</label>
<div class="col-sm-10">
<input type="hidden" name="DynamicModel[gridRadios]" value=""><div id="dynamicmodel-gridradios" role="radiogroup"><div class="custom-control custom-radio">
<input type="radio" id="i0" class="custom-control-input" name="DynamicModel[gridRadios]" value="option1">
<label class="custom-control-label" for="i0">First radio</label>
<input type="hidden" name="DynamicModel[gridRadios]" value=""><div id="dynamicmodel-gridradios" role="radiogroup"><div class="form-check">
<input type="radio" id="i0" class="form-check-input" name="DynamicModel[gridRadios]" value="option1">
<label class="form-check-label" for="i0">First radio</label>
</div>
<div class="custom-control custom-radio">
<input type="radio" id="i1" class="custom-control-input" name="DynamicModel[gridRadios]" value="option2">
<label class="custom-control-label" for="i1">Second radio</label>
<div class="form-check">
<input type="radio" id="i1" class="form-check-input" name="DynamicModel[gridRadios]" value="option2">
<label class="form-check-label" for="i1">Second radio</label>
</div>
<div class="custom-control custom-radio">
<input type="radio" id="i2" class="custom-control-input" name="DynamicModel[gridRadios]" value="option3">
<label class="custom-control-label" for="i2">Third radio</label>
<div class="form-check">
<input type="radio" id="i2" class="form-check-input" name="DynamicModel[gridRadios]" value="option3">
<label class="form-check-label" for="i2">Third radio</label>
<div class="invalid-feedback "></div>
</div>
</div>
@ -135,14 +135,14 @@ HTML;
'action' => '/some-action',
'layout' => ActiveForm::LAYOUT_HORIZONTAL
]);
echo $form->field($model, 'checkboxName')->checkbox(['template' => "<div class=\"offset-lg-1 col-lg-3\">\n{input}\n{label}\n</div>\n<div class=\"col-lg-8\">{error}</div>"]);
echo $form->field($model, 'checkboxName')->checkbox(['template' => "<div class=\"form-check offset-lg-1 col-lg-3\">\n{input}\n{label}\n</div>\n<div class=\"col-lg-8\">{error}</div>"]);
ActiveForm::end();
$out = ob_get_clean();
$expected = <<<HTML
<div class="offset-lg-1 col-lg-3">
<input type="hidden" name="DynamicModel[checkboxName]" value="0"><input type="checkbox" id="dynamicmodel-checkboxname" class="custom-control-input" name="DynamicModel[checkboxName]" value="1">
<label class="custom-control-label" for="dynamicmodel-checkboxname">Checkbox Name</label>
<div class="form-check offset-lg-1 col-lg-3">
<input type="hidden" name="DynamicModel[checkboxName]" value="0"><input type="checkbox" id="dynamicmodel-checkboxname" class="form-check-input" name="DynamicModel[checkboxName]" value="1">
<label class="form-check-label" for="dynamicmodel-checkboxname">Checkbox Name</label>
</div>
<div class="col-lg-8"><div class="invalid-feedback "></div></div>
HTML;
@ -171,16 +171,16 @@ HTML;
$out = ob_get_clean();
$expected = <<<HTML
<div class="form-group field-dynamicmodel-attributename">
<label class="sr-only" for="dynamicmodel-attributename">Attribute Name</label>
<div class="mb-3 field-dynamicmodel-attributename">
<label class="form-label visually-hidden" for="dynamicmodel-attributename">Attribute Name</label>
<input type="text" id="dynamicmodel-attributename" class="form-control" name="DynamicModel[attributeName]" placeholder="Attribute Name">
</div>
HTML;
$expected2 = <<<HTML
<div class="form-group field-dynamicmodel-selectname">
<label for="dynamicmodel-selectname">Select Name</label>
<div class="mb-3 field-dynamicmodel-selectname">
<label class="form-label" for="dynamicmodel-selectname">Select Name</label>
<input type="hidden" name="DynamicModel[selectName]" value=""><select id="dynamicmodel-selectname" class="form-control" name="DynamicModel[selectName]" size="4" placeholder>
<option value="1">One</option>
<option value="2">Two</option>
@ -191,10 +191,10 @@ HTML;
</div>
HTML;
$expected3 = <<<HTML
<div class="form-group field-dynamicmodel-checkboxname">
<div class="custom-control custom-checkbox">
<input type="hidden" name="DynamicModel[checkboxName]" value="0"><input type="checkbox" id="dynamicmodel-checkboxname" class="custom-control-input" name="DynamicModel[checkboxName]" value="1">
<label class="sr-only custom-control-label" for="dynamicmodel-checkboxname">Checkbox Name</label>
<div class="mb-3 field-dynamicmodel-checkboxname">
<div class="form-check">
<input type="hidden" name="DynamicModel[checkboxName]" value="0"><input type="checkbox" id="dynamicmodel-checkboxname" class="form-check-input" name="DynamicModel[checkboxName]" value="1">
<label class="visually-hidden form-check-label" for="dynamicmodel-checkboxname">Checkbox Name</label>
</div>
@ -225,32 +225,32 @@ HTML;
$out = ob_get_clean();
$expected = <<<HTML
<div class="form-group field-user-firstname">
<label for="user-firstname">First Name</label>
<div class="mb-3 field-user-firstname">
<label class="form-label" for="user-firstname">First Name</label>
<input type="text" id="user-firstname" class="form-control" name="User[firstName]">
<div class="invalid-feedback"></div>
</div>
HTML;
$expected2 = <<<HTML
<div class="form-group field-user-lastname">
<label for="user-lastname">Last Name</label>
<div class="mb-3 field-user-lastname">
<label class="form-label" for="user-lastname">Last Name</label>
<input type="text" id="user-lastname" class="form-control" name="User[lastName]">
<div class="invalid-feedback"></div>
</div>
HTML;
$expected3 = <<<HTML
<div class="form-group field-user-username required">
<label for="user-username">Username</label>
<div class="mb-3 field-user-username required">
<label class="form-label" for="user-username">Username</label>
<input type="text" id="user-username" class="form-control" name="User[username]" aria-required="true">
<small class="form-text text-muted">Your username must be at least 4 characters long</small>
<div class="invalid-feedback"></div>
</div>
HTML;
$expected4 = <<<HTML
<div class="form-group field-user-password required">
<label for="user-password">Password</label>
<div class="mb-3 field-user-password required">
<label class="form-label" for="user-password">Password</label>
<input type="password" id="user-password" class="form-control" name="User[password]" aria-required="true">
<small class="form-text text-muted">Your password must be 8-20 characters long, contain letters and numbers, and must not contain spaces, special characters, or emoji.</small>
<div class="invalid-feedback"></div>
@ -280,8 +280,8 @@ HTML;
$out = ob_get_clean();
$expected = <<<HTML
<div class="form-group field-user-username required">
<label for="user-username">Username</label>
<div class="mb-3 field-user-username required">
<label class="form-label" for="user-username">Username</label>
<input type="text" id="user-username" class="form-control is-invalid" name="User[username]" aria-required="true" aria-invalid="true">
<small class="form-text text-muted">Your username must be at least 4 characters long</small>
<div class="invalid-feedback">Username cannot be blank.</div>

4
tests/AlertTest.php
View File

@ -25,7 +25,7 @@ class AlertTest extends TestCase
<div id="w0" class="alert-warning alert alert-dismissible" role="alert">
<strong>Holy guacamole!</strong> You should check in on some of those fields below.
<button type="button" class="close" data-dismiss="alert"><span aria-hidden="true">&times;</span></button>
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>
HTML;
@ -47,7 +47,7 @@ HTML;
<div id="w0" class="alert alert-dismissible" role="alert">
Message1
<button type="button" class="close" data-dismiss="alert"><span aria-hidden="true">&times;</span></button>
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>
HTML;

4
tests/ButtonDropdownTest.php
View File

@ -46,7 +46,7 @@ class ButtonDropdownTest extends TestCase
]);
$expected = <<<EXPECTED
<div id="w0" class="dropleft btn-group"><button id="w0-button" class="btn dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Action</button>
<div id="w0" class="dropleft btn-group"><button id="w0-button" class="btn dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false">Action</button>
<div id="w1" class="dropdown-menu"><a class="dropdown-item" href="#">ItemA</a>
<a class="dropdown-item" href="#">ItemB</a></div></div>
@ -72,7 +72,7 @@ EXPECTED;
$expected = <<<EXPECTED
<div id="w0" class="dropdown btn-group"><button id="w1" class="btn">Split dropdown</button>
<button id="w0-button" class="btn dropdown-toggle dropdown-toggle-split" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><span class="sr-only">Toggle Dropdown</span></button>
<button id="w0-button" class="btn dropdown-toggle dropdown-toggle-split" data-bs-toggle="dropdown" aria-expanded="false"><span class="visually-hidden">Toggle Dropdown</span></button>
<div id="w2" class="dropdown-menu"><a class="dropdown-item" href="#">ItemA</a>
<a class="dropdown-item" href="#">ItemB</a></div></div>
EXPECTED;

10
tests/CarouselTest.php
View File

@ -40,17 +40,17 @@ class CarouselTest extends TestCase
$expected = <<<HTML
<div id="w0" class="carousel slide" data-bs-ride="carousel">
<ol class="carousel-indicators"><li class="active" data-target="#w0" data-slide-to="0"></li>
<li data-target="#w0" data-slide-to="1"></li>
<li data-target="#w0" data-slide-to="2"></li></ol>
<div class="carousel-indicators"><button type="button" class="active" data-bs-target="#w0" data-bs-slide-to="0" aria-current="true"></button>
<button type="button" data-bs-target="#w0" data-bs-slide-to="1"></button>
<button type="button" data-bs-target="#w0" data-bs-slide-to="2"></button></div>
<div class="carousel-inner"><div class="carousel-item active"><img src="https://via.placeholder.com/800x400?text=First+slide" class="d-block w-100">
<div class="d-none d-md-block carousel-caption"><h5>First slide label</h5><p>Nulla vitae elit libero, a pharetra augue mollis interdum.</p></div></div>
<div class="carousel-item"><img src="https://via.placeholder.com/800x400?text=Second+slide" class="d-block w-100">
<div class="d-none d-md-block carousel-caption"><h5>Second slide label</h5><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p></div></div>
<div class="carousel-item"><img src="https://via.placeholder.com/800x400?text=Third+slide" class="d-block w-100">
<div class="d-none d-md-block carousel-caption"><h5>Third slide label</h5><p>Praesent commodo cursus magna, vel scelerisque nisl consectetur.</p></div></div></div>
<a class="carousel-control-prev" href="#w0" data-slide="prev" role="button"><span class="carousel-control-prev-icon" aria-hidden="true"></span><span class="visually-hidden">Previous</span></a>
<a class="carousel-control-next" href="#w0" data-slide="next" role="button"><span class="carousel-control-next-icon" aria-hidden="true"></span><span class="visually-hidden">Next</span></a>
<button type="button" class="carousel-control-prev" data-bs-target="#w0" data-bs-slide="prev"><span class="carousel-control-prev-icon" aria-hidden="true"></span><span class="visually-hidden">Previous</span></button>
<button type="button" class="carousel-control-next" data-bs-target="#w0" data-bs-slide="next"><span class="carousel-control-next-icon" aria-hidden="true"></span><span class="visually-hidden">Next</span></button>
</div>
HTML;

40
tests/DropdownTest.php
View File

@ -42,7 +42,7 @@ class DropdownTest extends TestCase
$expected = <<<EXPECTED
<div id="w0" class="dropdown-menu"><h6 class="dropdown-header">Page1</h6>
<div class="dropdown" aria-expanded="false">
<a class="dropdown-item dropdown-toggle" href="#test" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" role="button">Dropdown1</a>
<a class="dropdown-item dropdown-toggle" href="#test" data-bs-toggle="dropdown" aria-expanded="false" role="button">Dropdown1</a>
<div id="w1" class="dropdown-submenu dropdown-menu"><h6 class="dropdown-header">Page2</h6>
<h6 class="dropdown-header">Page3</h6></div>
</div></div>
@ -84,13 +84,13 @@ EXPECTED;
$expected = <<<EXPECTED
<div id="w0" class="dropdown-menu"><div class="dropdown" aria-expanded="false">
<a class="dropdown-item dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" role="button">Dropdown1</a>
<a class="dropdown-item dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false" role="button">Dropdown1</a>
<div id="w1" class="submenu-list dropdown-submenu dropdown-menu"><h6 class="dropdown-header">Page1</h6>
<h6 class="dropdown-header">Page2</h6></div>
</div>
<div class="dropdown-divider"></div>
<hr class="dropdown-divider">
<div class="dropdown" aria-expanded="false">
<a class="dropdown-item dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" role="button">Dropdown2</a>
<a class="dropdown-item dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false" role="button">Dropdown2</a>
<div id="w2" class="submenu-override dropdown-submenu dropdown-menu"><h6 class="dropdown-header">Page3</h6>
<h6 class="dropdown-header">Page4</h6></div>
</div></div>
@ -128,14 +128,14 @@ EXPECTED;
);
$expected = <<<HTML
<div id="w0" class="dropdown-menu"><div class="dropdown" aria-expanded="false">
<a class="dropdown-item dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" role="button">Dropdown1</a>
<a class="dropdown-item dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false" role="button">Dropdown1</a>
<div id="w1" class="submenu-list dropdown-submenu dropdown-menu"><h6 class="dropdown-header">Page1</h6>
<h6 class="dropdown-header">Page2</h6></div>
</div>
<div class="dropdown-divider"></div>
<hr class="dropdown-divider">
<div class="dropdown" aria-expanded="false">
<a class="dropdown-item dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" role="button">Dropdown2</a>
<div id="w2" class="submenu-list dropdown-submenu dropdown-menu"><a class="dropdown-item active" href="/">Page3</a>
<a class="dropdown-item dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false" role="button">Dropdown2</a>
<div id="w2" class="submenu-list dropdown-submenu dropdown-menu"><a class="dropdown-item active" href="/" aria-current="true">Page3</a>
<h6 class="dropdown-header">Page4</h6></div>
</div></div>
HTML;
@ -173,13 +173,13 @@ HTML;
$expected = <<<HTML
<div id="w0" class="dropdown-menu"><div class="dropdown" aria-expanded="false">
<a class="dropdown-item disabled dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" role="button" tabindex="-1" aria-disabled="true">Dropdown1</a>
<a class="dropdown-item disabled dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false" role="button" tabindex="-1" aria-disabled="true">Dropdown1</a>
<div id="w1" class="submenu-list dropdown-submenu dropdown-menu"><h6 class="dropdown-header">Page1</h6>
<h6 class="dropdown-header">Page2</h6></div>
</div>
<div class="dropdown-divider"></div>
<hr class="dropdown-divider">
<div class="dropdown" aria-expanded="false">
<a class="dropdown-item dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" role="button">Dropdown2</a>
<a class="dropdown-item dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false" role="button">Dropdown2</a>
<div id="w2" class="submenu-list dropdown-submenu dropdown-menu"><h6 class="dropdown-header">Page3</h6>
<h6 class="dropdown-header">Page4</h6></div>
</div></div>
@ -193,12 +193,12 @@ HTML;
Dropdown::$counter = 0;
$form = <<<HTML
<form class="px-4 py-3">
<div class="form-group">
<label for="exampleDropdownFormEmail1">Email address</label>
<div class="mb-3">
<label class="form-label" for="exampleDropdownFormEmail1">Email address</label>
<input type="email" class="form-control" id="exampleDropdownFormEmail1" placeholder="email@example.com">
</div>
<div class="form-group">
<label for="exampleDropdownFormPassword1">Password</label>
<div class="mb-3">
<label class="form-label" for="exampleDropdownFormPassword1">Password</label>
<input type="password" class="form-control" id="exampleDropdownFormPassword1" placeholder="Password">
</div>
<div class="form-check">
@ -222,12 +222,12 @@ HTML;
$expected = <<<HTML
<div id="w0" class="dropdown-menu"><form class="px-4 py-3">
<div class="form-group">
<label for="exampleDropdownFormEmail1">Email address</label>
<div class="mb-3">
<label class="form-label" for="exampleDropdownFormEmail1">Email address</label>
<input type="email" class="form-control" id="exampleDropdownFormEmail1" placeholder="email@example.com">
</div>
<div class="form-group">
<label for="exampleDropdownFormPassword1">Password</label>
<div class="mb-3">
<label class="form-label" for="exampleDropdownFormPassword1">Password</label>
<input type="password" class="form-control" id="exampleDropdownFormPassword1" placeholder="Password">
</div>
<div class="form-check">
@ -238,7 +238,7 @@ Remember me
</div>
<button type="submit" class="btn btn-primary">Sign in</button>
</form>
<div class="dropdown-divider"></div>
<hr class="dropdown-divider">
<a class="dropdown-item" href="#">New around here? Sign up</a>
<a class="dropdown-item" href="#">Forgot password?</a></div>
HTML;

6
tests/LinkPagerTest.php
View File

@ -97,12 +97,12 @@ class LinkPagerTest extends TestCase
'pagination' => $pagination,
'disableCurrentPageButton' => false,
]);
$this->assertContains('<li class="page-item active"><a class="page-link" href="/?r=test&amp;page=6" data-page="5">6</a></li>', $output);
$this->assertContains('<li class="page-item active" aria-current="true"><a class="page-link" href="/?r=test&amp;page=6" data-page="5">6</a></li>', $output);
$output = LinkPager::widget([
'pagination' => $pagination,
'disableCurrentPageButton' => true,
]);
$this->assertContains('<li class="page-item active disabled"><a class="page-link" href="/?r=test&amp;page=6" data-page="5" tabindex="-1">6</a></li>', $output);
$this->assertContains('<li class="page-item active disabled" aria-current="true"><a class="page-link" href="/?r=test&amp;page=6" data-page="5" tabindex="-1">6</a></li>', $output);
}
public function testOptionsWithTagOption()
@ -132,7 +132,7 @@ class LinkPagerTest extends TestCase
$output
);
$this->assertContains(
'<div class="my-class page-item active"><a class="page-link" href="/?r=test&amp;page=2" data-page="1">2</a></div>',
'<div class="my-class page-item active" aria-current="true"><a class="page-link" href="/?r=test&amp;page=2" data-page="1">2</a></div>',
$output
);
}

33
tests/ModalTest.php
View File

@ -21,8 +21,8 @@ class ModalTest extends TestCase
$expected = <<<HTML
<div id="w0" class="fade modal" role="dialog" tabindex="-1" aria-hidden="true">
<div class="modal-dialog" role="document">
<div id="w0" class="modal fade" tabindex="-1" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-body test" style="text-align:center;">
@ -64,12 +64,12 @@ HTML;
$expected = <<<HTML
<div id="w0" class="fade modal" role="dialog" tabindex="-1" aria-hidden="true" aria-labelledby="w0-label">
<div class="modal-dialog" role="document">
<div id="w0" class="modal fade" tabindex="-1" aria-hidden="true" aria-labelledby="w0-label">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 id="w0-label" class="modal-title">Modal title</h5>
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span></button>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<p>Woohoo, you're reading this text in a modal!</p>
@ -109,8 +109,10 @@ HTML;
Modal::end();
$out = ob_get_clean();
$this->assertContains('<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#w0">Launch demo modal</button>',
$out);
$this->assertContains(
'<button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#w0">Launch demo modal</button>',
$out
);
}
public function testDialogOptions()
@ -124,8 +126,8 @@ HTML;
$expected = <<<HTML
<div id="w0" class="fade modal" role="dialog" tabindex="-1" aria-hidden="true">
<div class="test modal-dialog" role="document" style="text-align:center;">
<div id="w0" class="modal fade" tabindex="-1" aria-hidden="true">
<div class="test modal-dialog" style="text-align:center;">
<div class="modal-content">
<div class="modal-body">
@ -145,14 +147,14 @@ HTML;
Modal::$counter = 0;
$out = Modal::widget([
'closeButton' => false,
'centerVertical'=>true
'centerVertical' => true
]);
$expected = <<<HTML
<div id="w0" class="fade modal" role="dialog" tabindex="-1" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered" role="document">
<div id="w0" class="modal fade" tabindex="-1" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-body">
@ -166,19 +168,20 @@ HTML;
$this->assertEqualsWithoutLE($expected, $out);
}
public function testScrollable()
{
Modal::$counter = 0;
$out = Modal::widget([
'closeButton' => false,
'scrollable'=>true
'scrollable' => true
]);
$expected = <<<HTML
<div id="w0" class="fade modal" role="dialog" tabindex="-1" aria-hidden="true">
<div class="modal-dialog modal-dialog-scrollable" role="document">
<div id="w0" class="modal fade" tabindex="-1" aria-hidden="true">
<div class="modal-dialog modal-dialog-scrollable">
<div class="modal-content">
<div class="modal-body">

8
tests/NavBarTest.php
View File

@ -27,7 +27,7 @@ class NavBarTest extends TestCase
<nav id="w0" class="navbar-inverse navbar-static-top navbar-frontend navbar">
<div class="container">
<a class="navbar-brand" href="/">My Company</a>
<button type="button" class="navbar-toggler" data-toggle="collapse" data-target="#w0-collapse" aria-controls="w0-collapse" aria-expanded="false" aria-label="Toggle navigation"><span class="navbar-toggler-icon"></span></button>
<button type="button" class="navbar-toggler" data-bs-toggle="collapse" data-bs-target="#w0-collapse" aria-controls="w0-collapse" aria-expanded="false" aria-label="Toggle navigation"><span class="navbar-toggler-icon"></span></button>
<div id="w0-collapse" class="collapse navbar-collapse">
</div>
</div>
@ -109,13 +109,13 @@ HTML;
<nav id="w0" class="navbar navbar-expand-lg navbar-light bg-light">
<div class="container">
<a class="navbar-brand" href="/">My Company</a>
<button type="button" class="navbar-toggler" data-toggle="collapse" data-target="#w0-collapse" aria-controls="w0-collapse" aria-expanded="false" aria-label="Toggle navigation"><span class="navbar-toggler-icon"></span></button>
<button type="button" class="navbar-toggler" data-bs-toggle="collapse" data-bs-target="#w0-collapse" aria-controls="w0-collapse" aria-expanded="false" aria-label="Toggle navigation"><span class="navbar-toggler-icon"></span></button>
<div id="w0-collapse" class="collapse navbar-collapse">
<ul id="w1" class="mr-auto nav"><li class="nav-item"><a class="nav-link" href="#">Home</a></li>
<li class="nav-item"><a class="nav-link" href="#">Link</a></li>
<li class="dropdown nav-item"><a class="dropdown-toggle nav-link" href="#" data-toggle="dropdown">Dropdown</a><div id="w2" class="dropdown-menu"><a class="dropdown-item" href="#">Action</a>
<li class="dropdown nav-item"><a class="dropdown-toggle nav-link" href="#" data-bs-toggle="dropdown" role="button" aria-expanded="false">Dropdown</a><div id="w2" class="dropdown-menu"><a class="dropdown-item" href="#">Action</a>
<a class="dropdown-item" href="#">Another action</a>
<div class="dropdown-divider"></div>
<hr class="dropdown-divider">
<a class="dropdown-item" href="#">Something else here</a></div></li></ul><form class="form-inline my-2 my-lg-0">
<input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search">
<button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>

18
tests/NavTest.php
View File

@ -61,7 +61,7 @@ class NavTest extends TestCase
$expected = <<<EXPECTED
<ul id="w0" class="nav"><li class="nav-item"><a class="nav-link" href="#">Page1</a></li>
<li class="dropdown nav-item"><a class="dropdown-toggle nav-link" href="#" data-toggle="dropdown">Dropdown1</a><div id="w1" class="dropdown-menu"><h6 class="dropdown-header">Page2</h6>
<li class="dropdown nav-item"><a class="dropdown-toggle nav-link" href="#" data-bs-toggle="dropdown" role="button" aria-expanded="false">Dropdown1</a><div id="w1" class="dropdown-menu"><h6 class="dropdown-header">Page2</h6>
<h6 class="dropdown-header">Page3</h6></div></li></ul>
EXPECTED;
@ -100,7 +100,7 @@ EXPECTED;
$expected = <<<EXPECTED
<ul id="w0" class="nav"><li class="nav-item"><a class="nav-link" href="#">Page1</a></li>
<li class="dropdown nav-item"><a class="dropdown-toggle nav-link" href="#" data-toggle="dropdown">Dropdown1</a><div id="test1" class="test dropdown-menu" data-id="t1"><h6 class="dropdown-header">Page2</h6>
<li class="dropdown nav-item"><a class="dropdown-toggle nav-link" href="#" data-bs-toggle="dropdown" role="button" aria-expanded="false">Dropdown1</a><div id="test1" class="test dropdown-menu" data-id="t1"><h6 class="dropdown-header">Page2</h6>
<h6 class="dropdown-header">Page3</h6></div></li></ul>
EXPECTED;
@ -132,7 +132,7 @@ EXPECTED;
$expected = <<<EXPECTED
<ul id="w0" class="nav"><li class="nav-item"><a class="nav-link" href="#">Page1</a></li>
<li class="dropdown nav-item"><a class="dropdown-toggle nav-link" href="#" data-toggle="dropdown">Dropdown1</a><div id="w1" class="dropdown-menu"><h6 class="dropdown-header">Page2</h6>
<li class="dropdown nav-item"><a class="dropdown-toggle nav-link" href="#" data-bs-toggle="dropdown" role="button" aria-expanded="false">Dropdown1</a><div id="w1" class="dropdown-menu"><h6 class="dropdown-header">Page2</h6>
<h6 class="dropdown-header">Page3</h6></div></li>
<li class="nav-item"><a class="nav-link" href="#">Page4</a></li></ul>
EXPECTED;
@ -164,7 +164,7 @@ EXPECTED;
$expected = <<<EXPECTED
<ul id="w0" class="nav"><li class="nav-item"><a class="nav-link" href="/base/index.php?r=site%2Findex">Main</a></li>
<li class="dropdown nav-item"><a class="dropdown-toggle nav-link" href="#" data-toggle="dropdown">Admin</a><div id="w1" class="dropdown-menu"><a class="dropdown-item active" href="/base/index.php?r=site%2Fusers">Users</a>
<li class="dropdown nav-item"><a class="dropdown-toggle nav-link" href="#" data-bs-toggle="dropdown" role="button" aria-expanded="false">Admin</a><div id="w1" class="dropdown-menu"><a class="dropdown-item active" href="/base/index.php?r=site%2Fusers" aria-current="true">Users</a>
<a class="dropdown-item" href="/base/index.php?r=site%2Froles">Roles</a>
<a class="dropdown-item" href="/base/index.php?r=site%2Fstatuses">Statuses</a></div></li></ul>
EXPECTED;
@ -260,7 +260,7 @@ EXPECTED;
$expected = <<<EXPECTED
<ul id="w0" class="nav"><li class="nav-item"><a class="nav-link" href="#">Item1</a></li>
<li class="dropdown nav-item"><a class="dropdown-toggle nav-link" href="#" data-toggle="dropdown">Item2</a><div id="w1" class="dropdown-menu"><a class="dropdown-item" href="/base/index.php?r=site%2Findex">Page2</a>
<li class="dropdown nav-item"><a class="dropdown-toggle nav-link" href="#" data-bs-toggle="dropdown" role="button" aria-expanded="false">Item2</a><div id="w1" class="dropdown-menu"><a class="dropdown-item" href="/base/index.php?r=site%2Findex">Page2</a>
<h6 class="dropdown-header">Page3</h6></div></li></ul>
EXPECTED;
@ -293,7 +293,7 @@ EXPECTED;
$expected = <<<EXPECTED
<ul id="w0" class="nav"><li class="nav-item"><a class="nav-link" href="#">Item1</a></li>
<li class="dropdown nav-item"><a class="dropdown-toggle nav-link" href="#" data-toggle="dropdown">Item2</a><div id="w1" class="dropdown-menu"><a class="dropdown-item active" href="/base/index.php?r=site%2Findex">Page2</a>
<li class="dropdown nav-item"><a class="dropdown-toggle nav-link" href="#" data-bs-toggle="dropdown" role="button" aria-expanded="false">Item2</a><div id="w1" class="dropdown-menu"><a class="dropdown-item active" href="/base/index.php?r=site%2Findex" aria-current="true">Page2</a>
<h6 class="dropdown-header">Page3</h6></div></li></ul>
EXPECTED;
@ -324,7 +324,7 @@ EXPECTED;
$expected = <<<EXPECTED
<ul id="w0" class="nav"><li class="nav-item"><a class="nav-link disabled" href="#" tabindex="-1" aria-disabled="true">Item1</a></li>
<li class="dropdown nav-item"><a class="dropdown-toggle nav-link" href="#" data-toggle="dropdown">Item2</a><div id="w1" class="dropdown-menu"><a class="dropdown-item disabled" href="/base/index.php?r=site%2Findex" tabindex="-1" aria-disabled="true">Page2</a>
<li class="dropdown nav-item"><a class="dropdown-toggle nav-link" href="#" data-bs-toggle="dropdown" role="button" aria-expanded="false">Item2</a><div id="w1" class="dropdown-menu"><a class="dropdown-item disabled" href="/base/index.php?r=site%2Findex" tabindex="-1" aria-disabled="true">Page2</a>
<h6 class="dropdown-header">Page3</h6></div></li></ul>
EXPECTED;
@ -357,8 +357,8 @@ EXPECTED;
]);
$expected = <<<EXPECTED
<ul id="w0" class="nav"><li class="dropdown nav-item"><a class="dropdown-toggle nav-link active" href="#" data-toggle="dropdown">Dropdown</a><div id="w1" class="dropdown-menu"><div class="dropdown active" aria-expanded="false">
<a class="dropdown-item dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" role="button">Sub-dropdown</a>
<ul id="w0" class="nav"><li class="dropdown nav-item"><a class="dropdown-toggle nav-link active" href="#" data-bs-toggle="dropdown" role="button" aria-expanded="false">Dropdown</a><div id="w1" class="dropdown-menu"><div class="dropdown active" aria-expanded="false">
<a class="dropdown-item dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false" role="button">Sub-dropdown</a>
<div id="w2" class="dropdown-submenu dropdown-menu"><h6 class="dropdown-header">Page</h6></div>
</div></div></li></ul>
EXPECTED;

24
tests/ToastTest.php
View File

@ -19,10 +19,8 @@ class ToastTest extends TestCase
$expected = <<<HTML
<div id="w0" class="toast" role="alert" aria-live="assertive" aria-atomic="true">
<div class="toast-header">
<strong class="mr-auto"></strong>
<button type="button" class="ml-2 mb-1 close" aria-label="Close" data-dismiss="toast">
<span aria-hidden="true">&times;</span>
</button>
<strong class="me-auto"></strong>
<button type="button" class="btn-close" aria-label="Close" data-bs-dismiss="toast"></button>
</div>
<div class="toast-body test" style="text-align: center;">
@ -53,11 +51,9 @@ HTML;
$expected = <<<HTML
<div id="w0" class="toast" role="alert" aria-live="assertive" aria-atomic="true">
<div class="toast-header">
<strong class="mr-auto">Toast title</strong>
<strong class="me-auto">Toast title</strong>
<small class="text-muted">a minute ago</small>
<button type="button" class="ml-2 mb-1 close" aria-label="Close" data-dismiss="toast">
<span aria-hidden="true">&times;</span>
</button>
<button type="button" class="btn-close" aria-label="Close" data-bs-dismiss="toast"></button>
</div>
<div class="toast-body">
Woohoo, you're reading this text in a toast!
@ -81,11 +77,9 @@ HTML;
$expected = <<<HTML
<div id="w0" class="toast" role="alert" aria-live="assertive" aria-atomic="true">
<div class="toast-header">
<strong class="mr-auto">Toast title</strong>
<strong class="me-auto">Toast title</strong>
<small class="toast-date-time text-muted" style="text-align: right;">a minute ago</small>
<button type="button" class="ml-2 mb-1 close" aria-label="Close" data-dismiss="toast">
<span aria-hidden="true">&times;</span>
</button>
<button type="button" class="btn-close" aria-label="Close" data-bs-dismiss="toast"></button>
</div>
<div class="toast-body">
@ -108,10 +102,8 @@ HTML;
$expected = <<<HTML
<div id="w0" class="toast" role="alert" aria-live="assertive" aria-atomic="true">
<div class="toast-header">
<h5 class="mr-auto" style="text-align: left;">Toast title</h5>
<button type="button" class="ml-2 mb-1 close" aria-label="Close" data-dismiss="toast">
<span aria-hidden="true">&times;</span>
</button>
<h5 class="me-auto" style="text-align: left;">Toast title</h5>
<button type="button" class="btn-close" aria-label="Close" data-bs-dismiss="toast"></button>
</div>
<div class="toast-body">

4
tests/ToggleButtonGroupTest.php
View File

@ -25,7 +25,7 @@ class ToggleButtonGroupTest extends TestCase
]);
$expectedHtml = <<<HTML
<input type="hidden" name="ToggleButtonGroupTestModel[value]" value=""><div id="togglebuttongrouptestmodel-value" class="btn-group-toggle" data-toggle="buttons"><label class="btn btn-secondary" for="i0"><input type="checkbox" id="i0" name="ToggleButtonGroupTestModel[value][]" value="1" autocomplete="off">item 1</label>
<input type="hidden" name="ToggleButtonGroupTestModel[value]" value=""><div id="togglebuttongrouptestmodel-value" class="btn-group" role="group"><label class="btn btn-secondary" for="i0"><input type="checkbox" id="i0" name="ToggleButtonGroupTestModel[value][]" value="1" autocomplete="off">item 1</label>
<label class="btn btn-secondary" for="i1"><input type="checkbox" id="i1" name="ToggleButtonGroupTestModel[value][]" value="2" autocomplete="off">item 2</label></div>
HTML;
$this->assertEqualsWithoutLE($expectedHtml, $html);
@ -63,7 +63,7 @@ HTML;
]);
$expectedHtml = <<<HTML
<input type="hidden" name="ToggleButtonGroupTestModel[value]" value=""><div id="togglebuttongrouptestmodel-value" class="btn-group-toggle" data-toggle="buttons"><label class="btn btn-secondary" for="i0"><input type="radio" id="i0" name="ToggleButtonGroupTestModel[value]" value="1" autocomplete="off">item 1</label>
<input type="hidden" name="ToggleButtonGroupTestModel[value]" value=""><div id="togglebuttongrouptestmodel-value" class="btn-group" role="group"><label class="btn btn-secondary" for="i0"><input type="radio" id="i0" name="ToggleButtonGroupTestModel[value]" value="1" autocomplete="off">item 1</label>
<label class="btn btn-secondary" for="i1"><input type="radio" id="i1" name="ToggleButtonGroupTestModel[value]" value="2" autocomplete="off">item 2</label></div>
HTML;
$this->assertEqualsWithoutLE($expectedHtml, $html);