How to toggle src attribute of script when user click element?

Question

I use bootstrap 3.3.7 in my Django project. I have modal with <textarea>. Inside that textarea in the corner I put an icon. Below is a picture of my textarea. When the user clicks the icon I change the textarea size to full screen of the browser. Also, I use autosize plugin on my textarea which adjusts the height of the textarea to fit text.

In normal situations (when textarea is small) I need to use autosize plugin. When I click icon and change textarea to full screen I don't need to use this plugin.

Question: How to toogle src attribute of script when I click icon?

P.S. I have little conflict with autosize plugin when textarea in full size mode. Cause when I started to write in textarea in full size mode autosize plugin change it's height. For that's why I want to cancel this plugin when textarea in fullscreen mode.

autosize(document.querySelectorAll('#body')); // Autosize for textarea with "body" id

$('.textarea-icon').click(function() {
  $(".textarea-icon").toggleClass("fa-expand fa-compress")
  $(".textarea-wrapper").toggleClass('textarea-wrapper-fullscreen')
  $("#body").toggleClass('textarea-fullscreen')
  $(".modal-dialog").toggleClass('modal-dialog-fullscreen')
  $(".textarea-icon").toggleClass('textarea-icon-fullscreen')
});

.dashboard-wrapper {
  position: relative;
}

#dashboard-content {
  float: right;
  width: 100%;
  margin-top: 51px;
}

.textarea-wrap {
  position: relative;
  display: inline-block;
  width: 100%;
}

.textarea-wrap .textarea-icon {
  position: absolute;
  top: 3px;
  right: 3px;
  color: #BDBDBD;
  text-decoration: none;
  font-size: 17px;
  outline: none;
  cursor: pointer
}

.textarea-wrap .textarea-icon:hover {
  color: #757575;
  outline: none;
}

.textarea-wrap.textarea-wrap-fullscreen {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.textarea-wrap textarea.textarea-fullscreen {
  margin-bottom: 30px;
  overflow-x: hidden;
  overflow-wrap: break-word;
  height: 100vh;
}

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/autosize@4.0.0/dist/autosize.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

<div class="dashboard-wrapper">
  <div id="dashboard-content">
    <div class="modal fade">
      <div class="modal-dialog modal-lg">
        <div class="modal-content">
          <form method="post" action="">
            <div class="form-group">
              <label for="body">Discription</label>
              <div class="textarea-wrapper">
                <textarea name="body" class="form-control" id="body"></textarea>
                <i class="fa fa-arrows textarea-icon" aria-hidden="true"></i>
              </div>
            </div>
          </form>
        </div>
      </div>
    </div>
  </div>
</div>

<script id="" src="{% static 'js/autosize.js'%}"></script>

EDIT:

autosize(document.querySelectorAll('#body')); // Autosize to textarea

$('.textarea-wrapper .fa-expand').click(function() {
    autosize.destroy(document.querySelectorAll('#body')); // Destroy Autosize to textarea when user click icon
});

$('.textarea-icon').click(function() {
   $(".textarea-icon").toggleClass("fa-expand fa-compress") // Change Icon Picture
   $(this).closest('.textarea-wrapper').toggleClass('fullscreen') // Change textarea size
});

$('.textarea-wrapper .fa-compress').click(function() { // DONT WORK
   autosize(document.querySelectorAll('#body'));
})

Answer 1

If I understood you right, you just want use autosize.destroy() on appropriate element when you enlarged it (i.e. in "click" event, when you change your textarea behaviour). Basically it should disable plugin working on your textarea.

(minor side comment) Apart from that I would vote for adding some particular class to the wrapper around textarea and then adjusting css according to that class, so you would avoid a few queries to DOM in "click" function.