Chris@17: <?php
Chris@17: 
Chris@17: namespace Drupal\responsive_image\Tests;
Chris@17: 
Chris@17: use Drupal\FunctionalJavascriptTests\WebDriverTestBase;
Chris@17: use Drupal\responsive_image\Entity\ResponsiveImageStyle;
Chris@17: 
Chris@17: /**
Chris@17:  * Class ResponsiveImageFieldUiTest.
Chris@17:  *
Chris@17:  * @group responsive_image
Chris@17:  */
Chris@17: class ResponsiveImageFieldUiTest extends WebDriverTestBase {
Chris@17: 
Chris@17:   /**
Chris@17:    * Modules to install.
Chris@17:    *
Chris@17:    * @var array
Chris@17:    */
Chris@17:   public static $modules = [
Chris@17:     'node',
Chris@17:     'field_ui',
Chris@17:     'image',
Chris@17:     'responsive_image',
Chris@17:     'responsive_image_test_module',
Chris@17:     'block',
Chris@17:   ];
Chris@17: 
Chris@17:   /**
Chris@17:    * {@inheritdoc}
Chris@17:    */
Chris@17:   protected function setUp() {
Chris@17:     parent::setUp();
Chris@17:     $this->drupalPlaceBlock('system_breadcrumb_block');
Chris@17:     // Create a test user.
Chris@17:     $admin_user = $this->drupalCreateUser([
Chris@17:       'access content',
Chris@17:       'administer content types',
Chris@17:       'administer node fields',
Chris@17:       'administer node form display',
Chris@17:       'administer node display',
Chris@17:       'bypass node access',
Chris@17:     ]);
Chris@17:     $this->drupalLogin($admin_user);
Chris@17: 
Chris@17:     // Create content type, with underscores.
Chris@17:     $type_name = strtolower($this->randomMachineName(8)) . '_test';
Chris@17:     $type = $this->drupalCreateContentType([
Chris@17:       'name' => $type_name,
Chris@17:       'type' => $type_name,
Chris@17:     ]);
Chris@17:     $this->type = $type->id();
Chris@17:   }
Chris@17: 
Chris@17:   /**
Chris@17:    * Tests formatter settings.
Chris@17:    */
Chris@17:   public function testResponsiveImageFormatterUi() {
Chris@17:     $manage = 'admin/structure/types/manage/' . $this->type;
Chris@17:     $add_field = $manage . '/fields/add-field';
Chris@17:     $manage_display = $manage . '/display';
Chris@17:     $assert_session = $this->assertSession();
Chris@17: 
Chris@17:     // Create a field, and a node with some data for the field.
Chris@17:     // Create the field.
Chris@17:     $this->drupalGet($add_field);
Chris@17: 
Chris@17:     $page = $this->getSession()->getPage();
Chris@17:     $storage_type = $page->findField('edit-new-storage-type');
Chris@17:     $storage_type->setValue('image');
Chris@17: 
Chris@17:     // Set the label.
Chris@17:     $label = $page->findField('edit-label');
Chris@17:     $label->setValue('Image');
Chris@17: 
Chris@17:     // Wait for the machine name.
Chris@17:     $assert_session->waitForElementVisible('css', '[name="label"] + * .machine-name-value');
Chris@17: 
Chris@17:     // Save the current page.
Chris@17:     $save_button = $page->findButton('Save and continue');
Chris@17:     $save_button->click();
Chris@17: 
Chris@17:     // Display the "Manage display" page.
Chris@17:     $this->drupalGet($manage_display);
Chris@17: 
Chris@17:     // Change the formatter and check that the summary is updated.
Chris@17:     $page = $this->getSession()->getPage();
Chris@17: 
Chris@17:     $field_image_type = $page->findField('fields[field_image][type]');
Chris@17:     $field_image_type->setValue('responsive_image');
Chris@17: 
Chris@17:     $summary_text = $assert_session->waitForElement('xpath', $this->cssSelectToXpath('#field-image .ajax-new-content .field-plugin-summary'));
Chris@17:     $this->assertEquals('Select a responsive image style.', $summary_text->getText());
Chris@17: 
Chris@17:     $page->pressButton('Save');
Chris@17:     $assert_session->responseContains("Select a responsive image style.");
Chris@17: 
Chris@17:     // Create responsive image styles.
Chris@17:     $responsive_image_style = ResponsiveImageStyle::create([
Chris@17:       'id' => 'style_one',
Chris@17:       'label' => 'Style One',
Chris@17:       'breakpoint_group' => 'responsive_image_test_module',
Chris@17:       'fallback_image_style' => 'thumbnail',
Chris@17:     ]);
Chris@17:     $responsive_image_style
Chris@17:       ->addImageStyleMapping('responsive_image_test_module.mobile', '1x', [
Chris@17:         'image_mapping_type' => 'image_style',
Chris@17:         'image_mapping' => 'thumbnail',
Chris@17:       ])
Chris@17:       ->addImageStyleMapping('responsive_image_test_module.narrow', '1x', [
Chris@17:         'image_mapping_type' => 'image_style',
Chris@17:         'image_mapping' => 'medium',
Chris@17:       ])
Chris@17:       // Test the normal output of mapping to an image style.
Chris@17:       ->addImageStyleMapping('responsive_image_test_module.wide', '1x', [
Chris@17:         'image_mapping_type' => 'image_style',
Chris@17:         'image_mapping' => 'large',
Chris@17:       ])
Chris@17:       ->save();
Chris@17:     \Drupal::entityManager()->clearCachedFieldDefinitions();
Chris@17:     // Refresh the page.
Chris@17:     $this->drupalGet($manage_display);
Chris@17:     $assert_session->responseContains("Select a responsive image style.");
Chris@17: 
Chris@17:     // Click on the formatter settings button to open the formatter settings
Chris@17:     // form.
Chris@17:     $field_image_type = $page->findField('fields[field_image][type]');
Chris@17:     $field_image_type->setValue('responsive_image');
Chris@17: 
Chris@17:     $page->find('css', '#edit-fields-field-image-settings-edit')->click();
Chris@17:     $assert_session->waitForField('fields[field_image][settings_edit_form][settings][responsive_image_style]');
Chris@17: 
Chris@17:     // Assert that the correct fields are present.
Chris@17:     $fieldnames = [
Chris@17:       'fields[field_image][settings_edit_form][settings][responsive_image_style]',
Chris@17:       'fields[field_image][settings_edit_form][settings][image_link]',
Chris@17:     ];
Chris@17:     foreach ($fieldnames as $fieldname) {
Chris@17:       $assert_session->fieldExists($fieldname);
Chris@17:     }
Chris@17:     $page->findField('fields[field_image][settings_edit_form][settings][responsive_image_style]')->setValue('style_one');
Chris@17:     $page->findField('fields[field_image][settings_edit_form][settings][image_link]')->setValue('content');
Chris@17:     // Save the form to save the settings.
Chris@17:     $page->pressButton('Save');
Chris@17: 
Chris@17:     $assert_session->responseContains('Responsive image style: Style One');
Chris@17:     $assert_session->responseContains('Linked to content');
Chris@17: 
Chris@17:     $page->find('css', '#edit-fields-field-image-settings-edit')->click();
Chris@17:     $assert_session->waitForField('fields[field_image][settings_edit_form][settings][responsive_image_style]');
Chris@17:     $page->findField('fields[field_image][settings_edit_form][settings][image_link]')->setValue('file');
Chris@17: 
Chris@17:     // Save the form to save the settings.
Chris@17:     $page->pressButton('Save');
Chris@17: 
Chris@17:     $assert_session->responseContains('Responsive image style: Style One');
Chris@17:     $assert_session->responseContains('Linked to file');
Chris@17:   }
Chris@17: 
Chris@17: }