KaneAI - World’s First E2E Software Testing Agent.Book a Demo 
How to use su method in taiko
Best JavaScript code snippet using taiko
generator.js
Source:generator.js 
1jQuery(document).ready(function($) {2 // Prepare data3 var $generator = $('#su-generator'),4 $search = $('#su-generator-search'),5 $filter = $('#su-generator-filter'),6 $filters = $filter.children('a'),7 $choices = $('#su-generator-choices'),8 $choice = $choices.find('span'),9 $settings = $('#su-generator-settings'),10 $prefix = $('#su-compatibility-mode-prefix'),11 $result = $('#su-generator-result'),12 $selected = $('#su-generator-selected'),13 mce_selection = '';14 // Hotkey15 if (typeof $.hotkeys == 'object' && $.hotkeys.version === '(beta)(0.0.3)' && su_generator.hotkey) {16 $.hotkeys.add(su_generator.hotkey, function() {17 $('.su-generator-button').trigger('click');18 });19 }20 // Generator button21 $('body').on('click', '.su-generator-button', function(e) {22 e.preventDefault();23 // Save the target24 window.su_generator_target = $(this).data('target');25 // Get open shortcode26 var shortcode = $(this).data('shortcode');27 // Open magnificPopup28 $(this).magnificPopup({29 type: 'inline',30 alignTop: true,31 callbacks: {32 open: function() {33 // Open queried shortcode34 if (shortcode) $choice.filter('[data-shortcode="' + shortcode + '"]').trigger('click');35 // Focus search field when popup is opened36 else window.setTimeout(function() {37 $search.focus();38 }, 200);39 // Change z-index40 $('body').addClass('su-mfp-shown');41 // Save selection42 mce_selection = (typeof tinyMCE !== 'undefined' && tinyMCE.activeEditor != null && tinyMCE.activeEditor.hasOwnProperty('selection')) ? tinyMCE.activeEditor.selection.getContent({43 format: "text"44 }) : '';45 },46 close: function() {47 // Clear search field48 $search.val('');49 // Hide settings50 $settings.html('').hide();51 // Remove narrow class52 $generator.removeClass('su-generator-narrow');53 // Show filters54 $filter.show();55 // Show choices panel56 $choices.show();57 $choice.show();58 // Clear selection59 mce_selection = '';60 // Change z-index61 $('body').removeClass('su-mfp-shown');62 }63 }64 }).magnificPopup('open');65 });66 // Filters67 $filters.click(function(e) {68 // Prepare data69 var filter = $(this).data('filter');70 // If filter All, show all choices71 if (filter === 'all') $choice.css({72 opacity: 173 }).removeClass('su-generator-choice-first');74 // Else run search75 else {76 var regex = new RegExp(filter, 'gi');77 // Hide all choices78 $choice.css({79 opacity: 0.280 });81 // Find searched choices and show82 $choice.each(function() {83 // Get shortcode name84 var group = $(this).data('group');85 // Show choice if matched86 if (group.match(regex) !== null) $(this).css({87 opacity: 188 }).removeClass('su-generator-choice-first');89 });90 }91 e.preventDefault();92 });93 // Go to home link94 $('#su-generator').on('click', '.su-generator-home', function(e) {95 // Clear search field96 $search.val('');97 // Hide settings98 $settings.html('').hide();99 // Remove narrow class100 $generator.removeClass('su-generator-narrow');101 // Show filters102 $filter.show();103 // Show choices panel104 $choices.show();105 $choice.show();106 // Clear selection107 mce_selection = '';108 // Focus search field109 $search.focus();110 e.preventDefault();111 });112 // Generator close button113 $('#su-generator').on('click', '.su-generator-close', function(e) {114 // Close popup115 $.magnificPopup.close();116 // Prevent default action117 e.preventDefault();118 });119 // Search field120 $search.on({121 focus: function() {122 // Clear field123 $(this).val('');124 // Hide settings125 $settings.html('').hide();126 // Remove narrow class127 $generator.removeClass('su-generator-narrow');128 // Show choices panel129 $choices.show();130 $choice.css({131 opacity: 1132 }).removeClass('su-generator-choice-first');133 // Show filters134 $filter.show();135 },136 blur: function() {},137 keyup: function(e) {138 // Prepare vars139 var $first = $('.su-generator-choice-first:first'),140 val = $(this).val(),141 regex = new RegExp(val, 'gi'),142 best = 0;143 // Hotkey action144 if (e.keyCode === 13 && $first.length > 0) {145 e.preventDefault();146 $(this).val('').blur();147 $first.trigger('click');148 }149 // Hide all choices150 $choice.css({151 opacity: 0.2152 }).removeClass('su-generator-choice-first');153 // Loop and highlight choices154 $choice.each(function() {155 // Get choice data156 var data = $(this).data(),157 id = data.shortcode,158 name = data.name,159 desc = data.desc,160 group = data.group,161 matches = ([id, name, desc, group].join(' ')).match(regex);162 // Highlight choice if matched163 if (matches !== null) {164 // Highlight current choice165 $(this).css({166 opacity: 1167 });168 // Check for exact match169 if (val === id) {170 // Remove primary class from all choices171 $choice.removeClass('su-generator-choice-first');172 // Add primary class to the current choice173 $(this).addClass('su-generator-choice-first');174 // Prevent selecting by matches number175 best = 999;176 }177 // Check matches length178 else if (matches.length > best) {179 // Remove primary class from all choices180 $choice.removeClass('su-generator-choice-first');181 // Add primary class to the current choice182 $(this).addClass('su-generator-choice-first');183 // Save the score184 best = matches.length;185 }186 }187 });188 // Remove primary class if search field is empty189 if (val === '') $choice.removeClass('su-generator-choice-first');190 }191 });192 // Click on shortcode choice193 $choice.on('click', function(e) {194 // Prepare data195 var shortcode = $(this).data('shortcode');196 // Load shortcode options197 $.ajax({198 type: 'POST',199 url: ajaxurl,200 data: {201 action: 'su_generator_settings',202 shortcode: shortcode203 },204 beforeSend: function() {205 // Hide preview box206 $('#su-generator-preview').hide();207 // Hide choices panel208 $choices.hide();209 // Show loading animation210 $settings.addClass('su-generator-loading').show();211 // Add narrow class212 $generator.addClass('su-generator-narrow');213 // Hide filters214 $filter.hide();215 },216 success: function(data) {217 // Hide loading animation218 $settings.removeClass('su-generator-loading');219 // Insert new HTML220 $settings.html(data);221 // Apply selected text to the content field222 var $content = $('#su-generator-content');223 if (typeof mce_selection !== 'undefined' && mce_selection !== '' && $content.attr('type') !== 'hidden') {224 $content.val(mce_selection);225 }226 // Init range pickers227 $('.su-generator-range-picker').each(function(index) {228 var $picker = $(this),229 $val = $picker.find('input'),230 min = $val.attr('min'),231 max = $val.attr('max'),232 step = $val.attr('step');233 // Apply noUIslider234 $val.simpleSlider({235 snap: true,236 step: step,237 range: [min, max]238 });239 $val.show();240 $val.on('keyup blur', function(e) {241 $val.simpleSlider('setValue', $val.val());242 });243 });244 // Init color pickers245 $('.su-generator-select-color').each(function(index) {246 $(this).find('.su-generator-select-color-wheel').filter(':first').farbtastic('.su-generator-select-color-value:eq(' + index + ')');247 $(this).find('.su-generator-select-color-value').focus(function() {248 $('.su-generator-select-color-wheel:eq(' + index + ')').show();249 });250 $(this).find('.su-generator-select-color-value').blur(function() {251 $('.su-generator-select-color-wheel:eq(' + index + ')').hide();252 });253 });254 // Init image sourse pickers255 $('.su-generator-isp').each(function() {256 var $picker = $(this),257 $sources = $picker.find('.su-generator-isp-sources'),258 $source = $picker.find('.su-generator-isp-source'),259 $add_media = $picker.find('.su-generator-isp-add-media'),260 $images = $picker.find('.su-generator-isp-images'),261 $cats = $picker.find('.su-generator-isp-categories'),262 $taxes = $picker.find('.su-generator-isp-taxonomies'),263 $terms = $('.su-generator-isp-terms'),264 $val = $picker.find('.su-generator-attr'),265 frame;266 // Update hidden value267 var update = function() {268 var val = 'none',269 ids = '',270 source = $sources.val();271 // Media library272 if (source === 'media') {273 var images = [];274 $images.find('span').each(function(i) {275 images[i] = $(this).data('id');276 });277 if (images.length > 0) ids = images.join(',');278 }279 // Category280 else if (source === 'category') {281 var categories = $cats.val() || [];282 if (categories.length > 0) ids = categories.join(',');283 }284 // Taxonomy285 else if (source === 'taxonomy') {286 var tax = $taxes.val() || '',287 terms = $terms.val() || [];288 if (tax !== '0' && terms.length > 0) val = 'taxonomy: ' + tax + '/' + terms.join(',');289 }290 // Deselect291 else if (source === '0') {292 val = 'none';293 }294 // Other options295 else {296 val = source;297 }298 if (ids !== '') val = source + ': ' + ids;299 $val.val(val).trigger('change');300 }301 // Switch source302 $sources.on('change', function(e) {303 var source = $(this).val();304 e.preventDefault();305 $source.removeClass('su-generator-isp-source-open');306 if (source.indexOf(':') === -1) $picker.find('.su-generator-isp-source-' + source).addClass('su-generator-isp-source-open');307 update();308 });309 // Remove image310 $images.on('click', 'span i', function() {311 $(this).parent('span').css('border-color', '#f03').fadeOut(300, function() {312 $(this).remove();313 update();314 });315 });316 // Add image317 $add_media.click(function(e) {318 e.preventDefault();319 if (typeof(frame) !== 'undefined') frame.close();320 frame = wp.media.frames.su_media_frame_1 = wp.media({321 title: su_generator.isp_media_title,322 library: {323 type: 'image'324 },325 button: {326 text: su_generator.isp_media_insert327 },328 multiple: true329 });330 frame.on('select', function() {331 var files = frame.state().get('selection').toJSON();332 $images.find('em').remove();333 $.each(files, function(i) {334 $images.append('<span data-id="' + this.id + '" title="' + this.title + '"><img src="' + this.url + '" alt="" /><i class="fa fa-times"></i></span>');335 });336 update();337 }).open();338 });339 // Sort images340 $images.sortable({341 revert: 200,342 containment: $picker,343 tolerance: 'pointer',344 stop: function() {345 update();346 }347 });348 // Select categories and terms349 $cats.on('change', update);350 $terms.on('change', update);351 // Select taxonomy352 $taxes.on('change', function() {353 var $cont = $(this).parents('.su-generator-isp-source'),354 tax = $(this).val();355 // Remove terms356 $terms.hide().find('option').remove();357 update();358 // Taxonomy is not selected359 if (tax === '0') return;360 // Taxonomy selected361 else {362 var ajax_term_select = $.ajax({363 url: ajaxurl,364 type: 'post',365 dataType: 'html',366 data: {367 'action': 'su_generator_get_terms',368 'tax': tax,369 'class': 'su-generator-isp-terms',370 'multiple': true,371 'size': 10372 },373 beforeSend: function() {374 if (typeof ajax_term_select === 'object') ajax_term_select.abort();375 $terms.html('').attr('disabled', true).hide();376 $cont.addClass('su-generator-loading');377 },378 success: function(data) {379 $terms.html(data).attr('disabled', false).show();380 $cont.removeClass('su-generator-loading');381 }382 });383 }384 });385 });386 // Init media buttons387 $('.su-generator-upload-button').each(function() {388 var $button = $(this),389 $val = $(this).parents('.su-generator-attr-container').find('input:text'),390 file;391 $button.on('click', function(e) {392 e.preventDefault();393 e.stopPropagation();394 // If the frame already exists, reopen it395 if (typeof(file) !== 'undefined') file.close();396 // Create WP media frame.397 file = wp.media.frames.su_media_frame_2 = wp.media({398 // Title of media manager frame399 title: su_generator.upload_title,400 button: {401 //Button text402 text: su_generator.upload_insert403 },404 // Do not allow multiple files, if you want multiple, set true405 multiple: false406 });407 //callback for selected image408 file.on('select', function() {409 var attachment = file.state().get('selection').first().toJSON();410 $val.val(attachment.url).trigger('change');411 });412 // Open modal413 file.open();414 });415 });416 // Init icon pickers417 $('.su-generator-icon-picker-button').each(function() {418 var $button = $(this),419 $field = $(this).parents('.su-generator-attr-container'),420 $val = $field.find('.su-generator-attr'),421 $picker = $field.find('.su-generator-icon-picker'),422 $filter = $picker.find('input:text');423 $button.click(function(e) {424 $picker.toggleClass('su-generator-icon-picker-visible');425 $filter.val('').trigger('keyup');426 if ($picker.hasClass('su-generator-icon-picker-loaded')) return;427 // Load icons428 $.ajax({429 type: 'post',430 url: ajaxurl,431 data: {432 action: 'su_generator_get_icons'433 },434 dataType: 'html',435 beforeSend: function() {436 // Show loading animation437 $picker.addClass('su-generator-loading');438 // Add loaded class439 $picker.addClass('su-generator-icon-picker-loaded');440 },441 success: function(data) {442 $picker.append(data);443 var $icons = $picker.children('i');444 $icons.click(function(e) {445 $val.val('icon: ' + $(this).attr('title'));446 $picker.removeClass('su-generator-icon-picker-visible');447 $val.trigger('change');448 e.preventDefault();449 });450 $filter.on({451 keyup: function() {452 var val = $(this).val(),453 regex = new RegExp(val, 'gi');454 // Hide all choices455 $icons.hide();456 // Find searched choices and show457 $icons.each(function() {458 // Get shortcode name459 var name = $(this).attr('title');460 // Show choice if matched461 if (name.match(regex) !== null) $(this).show();462 });463 },464 focus: function() {465 $(this).val('');466 $icons.show();467 }468 });469 $picker.removeClass('su-generator-loading');470 }471 });472 e.preventDefault();473 });474 });475 // Init switches476 $('.su-generator-switch').click(function(e) {477 // Prepare data478 var $switch = $(this),479 $value = $switch.parent().children('input'),480 is_on = $value.val() === 'yes';481 // Disable482 if (is_on) {483 // Change value484 $value.val('no').trigger('change');485 }486 // Enable487 else {488 // Change value489 $value.val('yes').trigger('change');490 }491 e.preventDefault();492 });493 $('.su-generator-switch-value').on('change', function() {494 // Prepare data495 var $value = $(this),496 $switch = $value.parent().children('.su-generator-switch'),497 value = $value.val();498 // Disable499 if (value === 'yes') $switch.removeClass('su-generator-switch-no').addClass('su-generator-switch-yes');500 // Enable501 else if (value === 'no') $switch.removeClass('su-generator-switch-yes').addClass('su-generator-switch-no');502 });503 // Init tax_term selects504 $('select#su-generator-attr-taxonomy').on('change', function() {505 var $taxonomy = $(this),506 tax = $taxonomy.val(),507 $terms = $('select#su-generator-attr-tax_term');508 // Load new options509 window.su_generator_get_terms = $.ajax({510 type: 'POST',511 url: ajaxurl,512 data: {513 action: 'su_generator_get_terms',514 tax: tax,515 noselect: true516 },517 dataType: 'html',518 beforeSend: function() {519 // Check previous requests520 if (typeof window.su_generator_get_terms === 'object') window.su_generator_get_terms.abort();521 // Show loading animation522 $terms.parent().addClass('su-generator-loading');523 },524 success: function(data) {525 // Remove previous options526 $terms.find('option').remove();527 // Append new options528 $terms.append(data);529 // Hide loading animation530 $terms.parent().removeClass('su-generator-loading');531 }532 });533 });534 // Init shadow pickers535 $('.su-generator-shadow-picker').each(function(index) {536 var $picker = $(this),537 $fields = $picker.find('.su-generator-shadow-picker-field input'),538 $hoff = $picker.find('.su-generator-sp-hoff'),539 $voff = $picker.find('.su-generator-sp-voff'),540 $blur = $picker.find('.su-generator-sp-blur'),541 $color = {542 cnt: $picker.find('.su-generator-shadow-picker-color'),543 value: $picker.find('.su-generator-shadow-picker-color-value'),544 wheel: $picker.find('.su-generator-shadow-picker-color-wheel')545 },546 $val = $picker.find('.su-generator-attr');547 // Init color picker548 $color.wheel.farbtastic($color.value);549 $color.value.focus(function() {550 $color.wheel.show();551 });552 $color.value.blur(function() {553 $color.wheel.hide();554 });555 // Handle text fields556 $fields.on('change blur keyup', function() {557 $val.val($hoff.val() + 'px ' + $voff.val() + 'px ' + $blur.val() + 'px ' + $color.value.val()).trigger('change');558 });559 $val.on('keyup', function() {560 var value = $(this).val().split(' ');561 // Value is correct562 if (value.length === 4) {563 $hoff.val(value[0].replace('px', ''));564 $voff.val(value[1].replace('px', ''));565 $blur.val(value[2].replace('px', ''));566 $color.value.val(value[3]);567 $fields.trigger('keyup');568 }569 });570 });571 // Init border pickers572 $('.su-generator-border-picker').each(function(index) {573 var $picker = $(this),574 $fields = $picker.find('.su-generator-border-picker-field input, .su-generator-border-picker-field select'),575 $width = $picker.find('.su-generator-bp-width'),576 $style = $picker.find('.su-generator-bp-style'),577 $color = {578 cnt: $picker.find('.su-generator-border-picker-color'),579 value: $picker.find('.su-generator-border-picker-color-value'),580 wheel: $picker.find('.su-generator-border-picker-color-wheel')581 },582 $val = $picker.find('.su-generator-attr');583 // Init color picker584 $color.wheel.farbtastic($color.value);585 $color.value.focus(function() {586 $color.wheel.show();587 });588 $color.value.blur(function() {589 $color.wheel.hide();590 });591 // Handle text fields592 $fields.on('change blur keyup', function() {593 $val.val($width.val() + 'px ' + $style.val() + ' ' + $color.value.val()).trigger('change');594 });595 $val.on('keyup', function() {596 var value = $(this).val().split(' ');597 // Value is correct598 if (value.length === 3) {599 $width.val(value[0].replace('px', ''));600 $style.val(value[1]);601 $color.value.val(value[2]);602 $fields.trigger('keyup');603 }604 });605 });606 // Remove skip class when setting is changed607 $settings.find('.su-generator-attr').on('change keyup blur', function() {608 var $cnt = $(this).parents('.su-generator-attr-container'),609 _default = $cnt.data('default'),610 val = $(this).val();611 // Value is changed612 if (val != _default) $cnt.removeClass('su-generator-skip');613 else $cnt.addClass('su-generator-skip');614 });615 // Init value setters616 $('.su-generator-set-value').click(function(e) {617 $(this).parents('.su-generator-attr-container').find('input').val($(this).text()).trigger('change');618 });619 // Save selected value620 $selected.val(shortcode);621 // Load last used preset622 $.ajax({623 type: 'GET',624 url: ajaxurl,625 data: {626 action: 'su_generator_get_preset',627 id: 'last_used',628 shortcode: shortcode629 },630 beforeSend: function() {631 // Show loading animation632 // $settings.addClass('su-generator-loading');633 },634 success: function(data) {635 // Remove loading animation636 // $settings.removeClass('su-generator-loading');637 // Set new settings638 set(data);639 // Apply selected text to the content field640 var $content = $('#su-generator-content');641 if (typeof mce_selection !== 'undefined' && mce_selection !== '' && $content.attr('type') !== 'hidden') {642 $content.val(mce_selection);643 }644 },645 dataType: 'json'646 });647 },648 dataType: 'html'649 });650 });651 // Insert shortcode652 $('#su-generator').on('click', '.su-generator-insert', function(e) {653 // Prepare data654 var shortcode = parse();655 // Save current settings to presets656 add_preset('last_used', su_generator.last_used);657 // Close popup658 $.magnificPopup.close();659 // Save shortcode to div660 $result.text(shortcode);661 // Prevent default action662 e.preventDefault();663 // Save original activeeditor664 window.su_wpActiveEditor = window.wpActiveEditor;665 // Set new active editor666 window.wpActiveEditor = window.su_generator_target;667 // Insert shortcode668 window.wp.media.editor.insert(shortcode);669 // Restore previous editor670 window.wpActiveEditor = window.su_wpActiveEditor;671 // Check for target content editor672 // if (typeof window.su_generator_target === 'undefined') return;673 // Insert into default content editor674 // else if (window.su_generator_target === 'content') window.wp.media.editor.insert(shortcode);675 // Insert into ET page builder (text box)676 // else if (window.su_generator_target === 'et_pb_content_new') window.wp.media.editor.insert(shortcode);677 // Insert into textarea678 // else {679 // var $target = $('textarea#' + window.su_generator_target);680 // if ($target.length > 0) $target.val($target.val() + shortcode);681 // }682 });683 // Preview shortcode684 $('#su-generator').on('click', '.su-generator-toggle-preview', function(e) {685 // Prepare data686 var $preview = $('#su-generator-preview'),687 $button = $(this);688 // Hide button689 $button.hide();690 // Show preview box691 $preview.addClass('su-generator-loading').show();692 // Bind updating on settings changes693 $settings.find('input, textarea, select').on('change keyup blur', function() {694 update_preview();695 });696 // Update preview box697 update_preview(true);698 // Prevent default action699 e.preventDefault();700 });701 var gp_hover_timer;702 // Presets manager - mouseenter703 $('#su-generator').on('mouseenter click', '.su-generator-presets', function() {704 clearTimeout(gp_hover_timer);705 $('.su-gp-popup').show();706 });707 // Presets manager - mouseleave708 $('#su-generator').on('mouseleave', '.su-generator-presets', function() {709 gp_hover_timer = window.setTimeout(function() {710 $('.su-gp-popup').fadeOut(200);711 }, 600);712 });713 // Presets manager - add new preset714 $('#su-generator').on('click', '.su-gp-new', function(e) {715 // Prepare data716 var $container = $(this).parents('.su-generator-presets'),717 $list = $('.su-gp-list'),718 id = new Date().getTime();719 // Ask for preset name720 var name = prompt(su_generator.presets_prompt_msg, su_generator.presets_prompt_value);721 // Name is entered722 if (name !== '' && name !== null) {723 // Hide default text724 $list.find('b').hide();725 // Add new option726 $list.append('<span data-id="' + id + '"><em>' + name + '</em><i class="fa fa-times"></i></span>');727 // Perform AJAX request728 add_preset(id, name);729 }730 });731 // Presets manager - load preset732 $('#su-generator').on('click', '.su-gp-list span', function(e) {733 // Prepare data734 var shortcode = $('.su-generator-presets').data('shortcode'),735 id = $(this).data('id'),736 $insert = $('.su-generator-insert');737 // Hide popup738 $('.su-gp-popup').hide();739 // Disable hover timer740 clearTimeout(gp_hover_timer);741 // Get the preset742 $.ajax({743 type: 'GET',744 url: ajaxurl,745 data: {746 action: 'su_generator_get_preset',747 id: id,748 shortcode: shortcode749 },750 beforeSend: function() {751 // Disable insert button752 $insert.addClass('button-primary-disabled').attr('disabled', true);753 },754 success: function(data) {755 // Enable insert button756 $insert.removeClass('button-primary-disabled').attr('disabled', false);757 // Set new settings758 set(data);759 },760 dataType: 'json'761 });762 // Prevent default action763 e.preventDefault();764 e.stopPropagation();765 });766 // Presets manager - remove preset767 $('#su-generator').on('click', '.su-gp-list i', function(e) {768 // Prepare data769 var $list = $(this).parents('.su-gp-list'),770 $preset = $(this).parent('span'),771 id = $preset.data('id');772 // Remove DOM element773 $preset.remove();774 // Show default text if last preset was removed775 if ($list.find('span').length < 1) $list.find('b').show();776 // Perform ajax request777 remove_preset(id);778 // Prevent <span> action779 e.stopPropagation();780 // Prevent default action781 e.preventDefault();782 });783 /**784 * Create new preset with specified name from current settings785 */786 function add_preset(id, name) {787 // Prepare shortcode name and current settings788 var shortcode = $('.su-generator-presets').data('shortcode'),789 settings = get();790 // Perform AJAX request791 $.ajax({792 type: 'POST',793 url: ajaxurl,794 data: {795 action: 'su_generator_add_preset',796 id: id,797 name: name,798 shortcode: shortcode,799 settings: settings800 }801 });802 }803 /**804 * Remove preset by ID805 */806 function remove_preset(id) {807 // Get current shortcode name808 var shortcode = $('.su-generator-presets').data('shortcode');809 // Perform AJAX request810 $.ajax({811 type: 'POST',812 url: ajaxurl,813 data: {814 action: 'su_generator_remove_preset',815 id: id,816 shortcode: shortcode817 }818 });819 }820 function parse() {821 // Prepare data822 var query = $selected.val(),823 prefix = $prefix.val(),824 $settings = $('#su-generator-settings .su-generator-attr-container:not(.su-generator-skip) .su-generator-attr'),825 content = $('#su-generator-content').val(),826 result = new String('');827 // Open shortcode828 result += '[' + prefix + query;829 // Add shortcode attributes830 $settings.each(function() {831 // Prepare field and value832 var $this = $(this),833 value = '';834 // Selects835 if ($this.is('select')) value = $this.find('option:selected').val();836 // Other fields837 else value = $this.val();838 // Check that value is not empty839 if (value == null) value = '';840 else if (typeof value === 'array') value = value.join(',');841 // Add attribute842 if (value !== '') result += ' ' + $(this).attr('name') + '="' + $(this).val().toString().replace(/"/gi, "'") + '"';843 });844 // End of opening tag845 result += ']';846 // Wrap shortcode if content presented847 if (content != 'false') result += content + '[/' + prefix + query + ']';848 // Return result849 return result;850 }851 function get() {852 // Prepare data853 var query = $selected.val(),854 $settings = $('#su-generator-settings .su-generator-attr'),855 content = $('#su-generator-content').val(),856 data = {};857 // Add shortcode attributes858 $settings.each(function(i) {859 // Prepare field and value860 var $this = $(this),861 value = '',862 name = $this.attr('name');863 // Selects864 if ($this.is('select')) value = $this.find('option:selected').val();865 // Other fields866 else value = $this.val();867 // Check that value is not empty868 if (value == null) value = '';869 // Save value870 data[name] = value;871 });872 // Add content873 data['content'] = content.toString();874 // Return data875 return data;876 }877 function set(data) {878 // Prepare data879 var $settings = $('#su-generator-settings .su-generator-attr'),880 $content = $('#su-generator-content');881 // Loop through settings882 $settings.each(function() {883 var $this = $(this),884 name = $this.attr('name');885 // Data contains value for this field886 if (data.hasOwnProperty(name)) {887 // Set new value888 $this.val(data[name]);889 $this.trigger('keyup').trigger('change').trigger('blur');890 }891 });892 // Set content893 if (data.hasOwnProperty('content')) $content.val(data['content']).trigger('keyup').trigger('change').trigger('blur');894 // Update preview895 update_preview();896 }897 var update_preview_timer,898 update_preview_request;899 function update_preview(forced) {900 // Prepare data901 var $preview = $('#su-generator-preview'),902 shortcode = parse(),903 previous = $result.text();904 // Check forced mode905 forced = forced || false;906 // Break if preview box is hidden (preview isn't enabled)907 if (!$preview.is(':visible')) return;908 // Check shortcode is changed is this is not a forced mode909 if (shortcode === previous && !forced) return;910 // Run timer to filter often calls911 window.clearTimeout(update_preview_timer);912 update_preview_timer = window.setTimeout(function() {913 update_preview_request = $.ajax({914 type: 'POST',915 url: ajaxurl,916 cache: false,917 data: {918 action: 'su_generator_preview',919 shortcode: shortcode920 },921 beforeSend: function() {922 // Abort previous requests923 if (typeof update_preview_request === 'object') update_preview_request.abort();924 // Show loading animation925 $preview.addClass('su-generator-loading').html('');926 },927 success: function(data) {928 // Hide loading animation and set new HTML929 $preview.html(data).removeClass('su-generator-loading');930 },931 dataType: 'html'932 });933 }, 300);934 // Save shortcode to div935 $result.text(shortcode);936 }...
Using AI Code Generation
1const { openBrowser, goto, click, closeBrowser } = require('taiko');2(async () => {3 try {4 await openBrowser();5 await goto("google.com");6 await click("Sign in");7 await click("Create account");8 await write("John");9 await press("Tab");10 await write("Doe");11 await press("Tab");12 await write("
Using AI Code Generation
1const taiko = require('taiko');2(async () => {3 try {4 await openBrowser();5 await goto("google.com");6 await write("taiko",into(textBox(toRightOf("Google Search"))));7 await click("Google Search");8 await click("Taiko - A Node.js library for automating end-to-end tests");9 await click("Documentation");10 await click("API Reference");11 await click("Browser");12 await click("openBrowser");13 await click("Examples");14 await click("openBrowser")
Using AI Code Generation
1const { openBrowser, goto, click, closeBrowser, below, textBox } = require('taiko');2(async () => {3 try {4 await openBrowser({ headless: false });5 await click("Sign in");6 await click("Create account");7 await write("John", into(textBox(below("First name"))));8 await write("Doe", into(textBox(below("Last name"))));9 await write("
Using AI Code Generation
1const { openBrowser, goto, closeBrowser, click, textBox, toRightOf, write, button, into, dropDown, text, waitFor, $ } = require('taiko');2(async () => {3 try {4 await openBrowser();5 await click('Login');6 await write('admin');7 await click('Password');8 await write('admin');9 await click('Login');10 await click('Admin');11 await click('Users');12 await click('Add User');13 await write('testuser');14 await click('Password');15 await write('testuser');16 await click('Name');17 await write('Test User');18 await click('Email');19 await write('
Using AI Code Generation
1const { openBrowser, goto, click, closeBrowser, write, press, toRightOf, text, focus, textBox, button, link, $ } = require('taiko');2(async () => {3 try {4 await openBrowser({ headless: false });5 await write("taiko", into(textBox(toRightOf("Google Search"))));6 await press("Enter");7 await click("Taiko · Get Started with Taiko - A Node.js library for browser automation.");8 await click("Documentation");9 await click("Installation");10 await click("Install using npm");11 await focus(textBox("Search"));12 await write("git", into(textBox("Search")));13 await press("Enter");14 await click("Git - Wikipedia");15 await click("Download Git");16 await click("Windows");17 await click("Download for Windows");18 await click("Download");19 await click("Next");20 await click("Next");21 await click("Next");22 await click("Next");23 await click("Next");24 await click("Install");25 await click("Finish");26 await click("Next");27 await click("Next");28 await click("Next");29 await click("Finish");30 await click("Next");31 await click("Finish");32 await click("Next");33 await click("Next");34 await click("N
Using AI Code Generation
1const { openBrowser, goto, write, click, closeBrowser, text, $, button, below, toRightOf, into, toLeftOf, waitFor, image, focus, textBox, radioButton, link, dropDown, checkBox, evaluate, below, above, toLeftOf, toRightOf, near, intercept, rangeSlider, to, browser } = require('taiko');2(async () => {3 try {4 await openBrowser();5 await write("taiko", into(textBox({"placeholder":"Search"})));6 await click("Google Search");7 await click(link("Taiko: Test Automation for modern web apps"));8 await click("Get Started");9 await click("Install Taiko");10 await click("Install");11 await click("Try it out");12 await write("Taiko is an open source test automation framework for modern web applications.");13 await click("Run");14 await click("Next");15 await click("Next");16 await click("Ne
Using AI Code Generation
1const { openBrowser, goto, click, closeBrowser, button, textBox, write, dropDown, toRightOf, into, waitFor, $, text, focus, press, screenshot, evaluate, below, above, toLeftOf, link, toLeftOf, toRightOf, image, attach, to, intercept, clear, reload, scrollTo, scrollRight, scrollLeft, scrollUp, scrollDown, hover, highlight, doubleClick, rightClick, tap, mouseAction, $x, $i, $a, $l, $n, $t, $d, $r, $c, $s, $f, $p, $g, $h, $m, $b, $u, $v, $w, $y, $z, $o, $q, $k, $e } = require('taiko');2const assert = require("assert");3const headless = false;4const { openBrowserArgs, openBrowserConfig } = require('./taikoConfig');5(async () => {6 try {7 await openBrowser(openBrowserConfig);8 await write("Taiko");9 await press("Enter");10 await click("Taiko");11 await screenshot({ path: "taiko.png" });12 await hover("Taiko");13 await highlight("Taiko");14 await click("Taiko");15 await screenshot({ path: "taiko.png" });
Using AI Code Generation
1const { openBrowser, goto, closeBrowser, $, text, waitFor, button, click, write, into, toRightOf, focus, textBox, link, image, below, toLeftOf, $x, evaluate, reload, intercept, below, toLeftOf, toRightOf, above, screenshot } = require('taiko');2(async () => {3 try {4 await openBrowser({ headless: false });5 await click("Login");6 await write("admin", into(textBox(toRightOf("Username"))));7 await write("admin", into(textBox(toRightOf("Password"))));8 await click("Submit");9 await click("My Profile");10 await click("Edit Profile");11 await click("Update Profile");12 await click("Home");13 await click("Logout");14 await click("Login");15 await write("admin", into(textBox(toRightOf("Username"))));16 await write("admin", into(textBox(toRightOf("Password"))));17 await click("Submit");18 await click("My Profile");19 await click("Edit Profile");20 await write("admin", into(textBox(toRightOf("Username"))));21 await write("admin", into(textBox(toRightOf("Password"))));22 await write("admin", into(textBox(toRightOf("Confirm Password"))));23 await write("admin", into(textBox(toRightOf("First Name"))));24 await write("admin", into(textBox(toRightOf("Last Name"))));25 await write("admin", into(textBox(toRightOf("Email"))));26 await write("admin", into(textBox(toRightOf("Phone Number"))));27 await click("Update Profile");28 await click("Home");29 await click("Logout");30 await click("Login");31 await write("admin", into(textBox(toRightOf("Username"))));32 await write("admin", into(textBox(toRightOf("Password"))));33 await click("Submit");34 await click("My Profile");35 await click("Edit Profile");36 await write("admin", into(textBox(toRightOf("Username"))));37 await write("admin", into(textBox(toRightOf("Password"))));38 await write("admin", into(textBox(toRightOf("Confirm Password"))));39 await write("admin", into(textBox(toRightOf("First Name"))));40 await write("admin", into(textBox(toRightOf("Last Name"))));41 await write("admin
Using AI Code Generation
1const { openBrowser, goto, click, closeBrowser, screenshot, text, $, link, below, toRightOf, write, focus, toLeftOf, button, evaluate, reload, press, waitFor, textBox, into, clear, $x, doubleClick, rightClick, hover, intercept } = require('taiko');2(async () => {3 try {4 await openBrowser({ headless: false });5 await click("Login");6 await click("Email");7 await write("
Automation Testing Tutorials
Learn to execute automation testing from scratch with LambdaTest Learning Hub. Right from setting up the prerequisites to run your first automation test, to following best practices and diving deeper into advanced test scenarios. LambdaTest Learning Hubs compile a list of step-by-step guides to help you be proficient with different test automation frameworks i.e. Selenium, Cypress, TestNG etc.
LambdaTest Learning Hubs:
- JUnit Tutorial
- TestNG Tutorial
- Webdriver Tutorial
- WebDriverIO Tutorial
- Protractor Tutorial
- Selenium 4 Tutorial
- Jenkins Tutorial
- NUnit Tutorial
- Jest Tutorial
- Playwright Tutorial
- Cypress Tutorial
- PyTest Tutorial
YouTube
You could also refer to video tutorials over LambdaTest YouTube channel to get step by step demonstration from industry experts.
Run taiko automation tests on LambdaTest cloud grid
Perform automation testing on 3000+ real desktop and mobile devices online.
Try LambdaTest Now !!
Get 100 minutes of automation test minutes FREE!!
Was this article helpful?
